Блог

Главная - Вопросы по программированию - Отсортируйте числовой массив внутри объекта arrays, сохраняя порядок расположения других массивов в том же порядке, что и отсортированный числовой массив

Отсортируйте числовой массив внутри объекта arrays, сохраняя порядок расположения других массивов в том же порядке, что и отсортированный числовой массив

#javascript #arrays #sorting #javascript-objects

#javascript #массивы #сортировка #javascript-объекты

Вопрос:

Я знаю, это звучит как перегруженный вопрос, но позвольте мне уточнить. Я создал приложение, которое извлекает хранилища местоположений, facilities и передает их в цикл. Цикл запускается и сравнивает каждое средство (адрес) с адресом или почтовым индексом, введенным пользователем через API Google Maps DistanceMatrix. Здесь выводятся массивы facilities , distances и times . В этом небольшом примере я удалил все динамические части, чтобы получить рабочий выходной код для тестирования, и жестко запрограммировал все результаты. Кроме того, чтобы я не продолжал вызывать API Карт Google. В любом случае, все facilities , distances и times находятся в порядке и принадлежат друг другу. То, что я имею в виду, facilities[0] относится к ценностям distances[0] и times[0] . То же самое относится и к текущим элементам в каждом массиве. Каждый элемент [i] в массиве соответственно принадлежит тому же пронумерованному элементу [i] в другом массиве.

Я пытаюсь отсортировать distances массив, но теперь я, в некотором смысле, перемешиваю данные, поэтому я не уверен, как distances[0] сказать, перемещается ли он в distances[3] по порядку со значениями других массивов, потому что facilites[0] и times[0] не сортируются.

Теперь, перед сортировкой данных, я передаю каждый массив в resultsObject с помощью метода Object.assign. Вы увидите, что если вы протестируете это, у вас будет объект с тремя массивами данных, расположенными в одном и том же порядке (на основе того, что я объяснил выше). Есть ли способ отсортировать distances внутри resultsObject , одновременно сортируя два других facilites и times в том же порядке? Извините, если я переборщил с описанием или повторяюсь, но я пытаюсь быть как можно более описательным.

 let inputVal = [];
let facilityArray = [];
let distanceArray = [];
let timeArray = [];
let filteredArray = [];
let sortedArray = [];
let resultsObject, intDistanceResu<



callFetch = () => {
    const facilities = ["MD01", "PA01", "OH01", "NC01", "GA01", "SC01", "SC02", "TN01", "AL01", "FL02", "TX01", "IN01", "SC03", "FL01"];
    const distances = [133, 32, 538, 422, 795, 666, 664, 822, 1118, 867, 1504, 657, 635, 1210];
    const times = ["2 hours 12 mins", "47 mins", "8 hours 20 mins", "6 hours 32 mins", "12 hours 0 mins", "10 hours 2 mins",
        "9 hours 56 mins", "12 hours 21 mins", "16 hours 33 mins", "12 hours 43 mins", "22 hours 16 mins", "10 hours 16 mins",
        "9 hours 39 mins", "17 hours 35 mins"
    ];

    facilityArray.push(facilities);
    distanceArray.push(distances);
    timeArray.push(times);

    // console.log(distanceArray);
    // sortedArray = distanceArray.sort((a, b) => a - b);
    // console.log(sortedArray);

    resultsObject = Object.assign({}, [facilityArray, distanceArray, timeArray]);
    console.log(resultsObject);
}


form.addEventListener("submit", e => {
    e.preventDefault();
    callFetch();
});  
 <!DOCTYPE html>
<html>

<head>
    <title>Ethos Service Center - Google Maps Distance Search</title>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc NcPb1dKGj7Sk" crossorigin="anonymous">
</head>

<body>
    <div class="container-sm mt-3">
        <form class="form mb-3" id="form">
            <div class="search">
                <div class="card-body">
                    <div class="input-group">
                        <div class="input-group-prepend">
                            <span class="input-group-text">Patient Destination</span>
                        </div>
                        <input class="form-control" type="text" placeholder="Enter Zip Code" class="patientaddress" id="patientaddress">
                        <div class=" input-group-prepend ">
                            <span class="input-group-text " id="message "></span>
                        </div>
                    </div>
                    <hr>
                    <button class="btn btn-primary mt-2 " type="submit " id="submit ">Submit</button>
                </div>
            </div>
        </form>
    </div>
</body>

</html>  

 let inputVal = [];
let facilityArray = [];
let distanceArray = [];
let timeArray = [];
let filteredArray = [];
let sortedArray = [];
let resultsObject, intDistanceResu<



callFetch = () => {
    const facilities = ["MD01", "PA01", "OH01", "NC01", "GA01", "SC01", "SC02", "TN01", "AL01", "FL02", "TX01", "IN01", "SC03", "FL01"];
    const distances = [133, 32, 538, 422, 795, 666, 664, 822, 1118, 867, 1504, 657, 635, 1210];
    const times = ["2 hours 12 mins", "47 mins", "8 hours 20 mins", "6 hours 32 mins", "12 hours 0 mins", "10 hours 2 mins",
        "9 hours 56 mins", "12 hours 21 mins", "16 hours 33 mins", "12 hours 43 mins", "22 hours 16 mins", "10 hours 16 mins",
        "9 hours 39 mins", "17 hours 35 mins"
    ];

    facilityArray.push(facilities);
    distanceArray.push(distances);
    timeArray.push(times);

    // console.log(distanceArray);
    // sortedArray = distanceArray.sort((a, b) => a - b);
    // console.log(sortedArray);

    resultsObject = Object.assign({}, [facilityArray, distanceArray, timeArray]);
    console.log(resultsObject);
}


form.addEventListener("submit", e => {
    e.preventDefault();
    callFetch();
});  
 <!DOCTYPE html>
<html>

<head>
    <title>Service Center - Google Maps Distance Search</title>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc NcPb1dKGj7Sk" crossorigin="anonymous">
</head>

<body>
    <div class="container-sm mt-3">
        <form class="form mb-3" id="form">
            <div class="search">
                <div class="card-body">
                    <div class="input-group">
                        <div class="input-group-prepend">
                            <span class="input-group-text">Patient Destination</span>
                        </div>
                        <input class="form-control" type="text" placeholder="Enter Zip Code" class="patientaddress" id="patientaddress">
                        <div class=" input-group-prepend ">
                            <span class="input-group-text " id="message "></span>
                        </div>
                    </div>
                    <hr>
                    <button class="btn btn-primary mt-2 " type="submit " id="submit ">Submit</button>
                    <button class="btn btn-outline-success mt-2 ml-3 " type="reset " value="Reset " id="refresh">Clear Destination</button>
                </div>
            </div>
        </form>
    </div>
    <script type="text/javascript " src="main.js "></script>
</body>

</html>

Комментарии:

1. Лучшее решение — это вообще не иметь нескольких массивов. Используйте один массив объектов и отсортируйте объекты по distance свойству.

Ответ №1:

Объедините массивы в единый массив объектов, а затем отсортируйте по расстоянию

 const facilities = ["MD01", "PA01", "OH01", "NC01", "GA01", "SC01", "SC02", "TN01", "AL01", "FL02", "TX01", "IN01", "SC03", "FL01"];
    const distances = [133, 32, 538, 422, 795, 666, 664, 822, 1118, 867, 1504, 657, 635, 1210];
    const times = ["2 hours 12 mins", "47 mins", "8 hours 20 mins", "6 hours 32 mins", "12 hours 0 mins", "10 hours 2 mins",
        "9 hours 56 mins", "12 hours 21 mins", "16 hours 33 mins", "12 hours 43 mins", "22 hours 16 mins", "10 hours 16 mins",
        "9 hours 39 mins", "17 hours 35 mins"
    ];
    
const combined = facilities.map((facility,i) =>({facility, distance: distances[i], time: times[i]}))
                .sort((a,b) => a.distance-b.distance)
 
console.log(combined)

Ответ №2:

Object.assign Решение на самом деле не помогает вам приблизиться ни на шаг. Вам нужно было бы создать небольшие объекты для каждой тройки объектов, расстояния и времени:

 let triples = facilities.map((facility, i) => ({
    facility,
    distance: distances[i],
    time: times[i]
}));

Этот массив вы можете сортировать по расстоянию:

 triples.sort((a, b) => a.distance - b.distance);