Как исправить ошибку JS undefinit object[3]?

Question

[sochi-russia]

Есть код

var objectsCSV = '\n51.5406;46.0086;"от 4909р.";"в Саратов ";\n51.83;107.606;"от 10600р.";"в Улан-Удэ ";\n59.5339;30.1850;"от 3221р.";"в Санкт-Петербург ";\n55.7887;49.1221;"от 3934р.";"в Казань ";\n43.5992;39.7257;"от 4286р.";"в Сочи";\n43.1056;131.874;"от 18100р.";"во Владивосток";\n53.9;27.56;"от 6170р.";"в Минск ";\n55.04;82.9346;"от 8159р.";"в Новосибирск ";\n54.99;73.36;"от 8159р.";"в Омск ";\n55.154;61.4291;"от 4909р.";"в Челябинск ";\n54.7065;20.511;"от 4009р.";"в Калининград ";\n48.7194;44.5018;"от 3609р.";"в Волгоград ";';
var objects = objectsCSV.split('\n');

ymaps.ready(init);

function init() {
    var myMap = new ymaps.Map("map", {
            center: [53.03,67.37],
            zoom: 4}
      );
    
        for (var i = 0; i < objects.length; i++) {
            object = objects[i].split(';');
            
        var placemark = new ymaps.Placemark([object[0], object[1]], {
            balloonContent: object[3]+' <a href="/flights/?origin_iata=MOW&destination_iata=AER&depart_date=2024-11-26&return_date=2024-12-13&marker=87111&with_request=true"" id="block">Поиск билета</a>',
            iconCaption: object[2]
        }, {
            preset: 'islands#violetDotIconWithCaption'
        });
            placemark.balloon.events.add('click', function(e) {
                e.get('target').balloon.close();
            })
            myMap.geoObjects.add(placemark);
        }
}

адача в ссылку после знака вопроса вставить object[3], то-бишь вот так /flights/?object[3]+origin_iata=MOW&destination_iata=AER&depart_date=2024-11-26&return_date=2024-12-13&marker=87111&with_request=true"" id="block">Поиск билета Но выдается ошибка, не может идентифицировать object[3], таких объектов будет несколько и объект 5 и объект 6 в будущем. Подскажите как его правильно вставить.

Answer 1

[GrigoryMorozov]

Проблема возникает из-за того, что первый элемент в массиве objects — пустая строка (ведь objectsCSV начинается с переноса строки, по которому и будет выполняться разбиение).

В вашем случае можно поступить так:

var objects = objectsCSV.split('\n').slice(1);

Плюс у вас, судя по всему, неверно формируется строка. Правильный вариант подстановки такой:

balloonContent: `<a href="/flights/?${object[3]}origin_iata=...`

Но это не главное. Возникновение подобных ошибок связно со стилем кода, с которым трудно работать, и со сложностями с отладкой (я, например, сразу дописал к коду несколько вызовов console.log, чтобы понять, в чём дело). Попробуйте почитать стайлгайды по JS и руководства по отладке, чтобы избегать подобных ошибок в будущем.

Comments

[sochi-russia]

Григорий, первый объект это координаты, второй объект это цена, третий объект это город, задача вытащить любой объект и мочь вставить в ссылку

[sochi-russia]

balloonContent: `<a href="/flights/?${object[3]}origin_iata=...`

Так не вставляется, не преобразуется {object[3]} в данные объекта

[GrigoryMorozov]

sochi-russia, а что вы хотите вставить в строку после /flights/?? object[3] — это "в Саратов ", "в Улан-Удэ " и далее по списку. То есть результат будет такой:

<a href="/flights/?"в Саратов "origin_iata=...

[sochi-russia]

GrigoryMorozov, Объект 3 это пример, у меня будет объект 4, он будет содержать данные их я вставлю, пока у меня тих данных нет на примере объекта 3 мне сейчас необходимо понять как вставить данные из этого объекта в ссылку заключенную в одинарные скобки, что у меня не получается)

[sochi-russia]

GrigoryMorozov, с городом будет так выглядеть

<a title="Объект 3" href="/flights/?"Объект 4"origin_iata=

[GrigoryMorozov]

sochi-russia, в вашем случае:

`<a title=${object[3]} href="/flights/?${object[4]}origin_iata=...`

Конкретно в вашем примере четвёртого элемента у массивов не существует, но с третьим, как видите, всё отлично работает.

Обратите внимание на то, что я использую обратные кавычки: `. Можно, тем не менее, использовать и одинарные кавычки, но уже немного иначе:

'<a title=' + object[3] + ' href="/flights/?' + object[4] + 'origin_iata=...'

Также в примерах в этом комментарии я убрал двойные кавыки вокруг object[3] (поскольку они уже в него включены). Восстановите их, если необходимо:

`<a title="${object[3]}" href="/flights/?${object[4]}origin_iata=...`
'<a title="' + object[3] + '" href="/flights/?' + object[4] + 'origin_iata=...'

[sochi-russia]

GrigoryMorozov, пишет Uncaught TypeError: objectsCSV.split(...).split is not a function

[GrigoryMorozov]

sochi-russia, исправил ответ. Вторая там функция slice.