Как сохранить значение переменной, вставленной несколько раз в один и тот же список?

Question

Вот моя проблема: у меня есть функция, в которой у меня есть переменная, значение которой постоянно меняется при каждом вызове этой функции.Позже в коде функции я помещаю переменную в список.Но когда я делаю это несколько раз, переменные складываются хорошо, но все значения принимают то же, что и новое.

var new_plane; //I define these variables here because I want to use it again in other functions
var list_plane = [];

var Planes = { //I define the object
    number: "",
    airline: ""
};

function add_plane() {
    new_plane = Planes;
    new_plane.number = 10; //Random number
    new_plane.airline = "Air France"; //Random airline of a list

    list_plane.push(new_plane); //I push the variable in the list

    for (let i = 0; i < list_plane.length; i++) {
        document.body.innerHTML += list_plane[i].number + " " + list_plane[i].airline + "<br />"; //The body is used for the example and the output too
    };
};

Когда вводится первая плоскость, все в порядке.Но когда задана вторая плоскость, две плоскости имеют одинаковые значения, а не собственные значения, как ожидалось.

Answer 1

Перемещение

var Planes = { //I define the object
    number: "",
    airline: ""
};

внутри функции, потому что в противном случае у вас будет одинаковая ссылка на объект для каждого элемента в массиве.

---

Другим решением может быть использованиеPlane шаблон в качестве шаблона для нового объекта

// global
var Planes = {
        number: "",
        airline: ""
    };

function add_plane() {
    var new_plane = Object.assign({}, Planes); // get copy

    new_plane.number = 10;
    new_plane.airline = "Air France";

    list_plane.push(new_plane);

    for (let i = 0; i < list_plane.length; i++) {
        document.body.innerHTML += list_plane[i].number + " " + list_plane[i].airline + "<br />";
    } // no semicolon here
} // no semicolon here

Answer 2

Независимо от того, сколько ссылок будет иметь этот объект (даже в пределах одного массива), в целом у вас все еще есть только один объект.И вы обновляете свойства этого объекта.

Вместо этого определите новый объект для вставки в массив:

function add_plane() {
    let new_plane = {
        number: 10, //Random number
        airline: "Air France" //Random airline of a list
    };

    list_plane.push(new_plane); //I push the variable in the list

    for (let i = 0; i < list_plane.length; i++) {
        document.body.innerHTML += list_plane[i].number + " " + list_plane[i].airline + "<br />"; //The body is used for the example and the output too
    };
};

Answer 3

Это потому, что new_plane ссылается на один и тот же объект, и вы несколько раз помещаете его в массив.

Возможно, вы захотите каждый раз инициализировать новый объект, например:

function add_plane() {
  const new_plane = {
    number: 10,
    airline: "Air France"
  };

  list_plane.push(new_plane);

  //...
}

Однако я бы предложил передать массив в качестве аргумента функции add_plane или даже лучше использовать ООП.

Answer 4

var list_plane = [];

var Planes = function (n, a) { //I define the object
    this.number = n;
    this.airline = a;
};

function add_plane(num, air) {
    list_plane.push(new Planes(num, air)); //I push the variable in the list
}

function printAirplanes () {
    for (let i = 0; i < list_plane.length; i++) {
        document.body.innerHTML += list_plane[i].number + " " + list_plane[i].airline + "<br />"; //The body is used for the example and the output too
    };
};

add_plane(10, "Air france");
add_plane(15, "KLM");

printAirplanes();

С точки зрения развития, я думаю, что это чище.Одна важная вещь: я думаю, что вы должны удалить цикл for из метода, который добавляет.

Это также может быть переписано для ES2015 и других, но я думаю, что это может быть домашней работой в другой раз.

Answer 5

Это потому, что вам нужно создать новый экземпляр Planes: new_plane = new Planes ();

В настоящее время у вас есть объявленный единственный объект Planes, и вы продолжаете обновлять хранилище этого одного экземпляра. Независимо от того, добавите ли вы его в список или нет, любое другое использование этого объекта будет обновлено.

Edit: Вы также можете изменить свою декларацию на:

function Planes () { //I define the object
    number = "";
    airline = "";
}

Вот как вы делаете свой код ООП. Я пропустил разницу раньше, извините за это.