Мой код JavaScript с объектами и методами не работает

Question

Я сейчас на JavaScript и прошло несколько дней с тех пор, как я изучал объекты, поэтому я решил попробовать свои собственные. Проблема в том, что мой код на самом деле не работает. Печатает меня только первые предметы. Я уверен, что здесь я получу хорошие ответы, потому что это место мне очень помогло, когда я изучал и экспериментировал с HTML5 и CSS. Большое спасибо!

var person_1st = {
  name: "Plamen",
  surname: "Dobrev",
  age: "14",
  favourite_colour: "blue"
};

document.write(person_1st.name + "<br />" + person_1st.surname + "<br />" + person_1st.age + "<br />" + person_1st.favourite_colour);



function person_2nd(name, surname, age, favourite_colour) {
  this.name = name;
  this.surname = surname;
  this.age = age;
  this.favourite_colour = favourite_colour;
  this.new_favourite_colour = function(favourite_colour) {
    this.favourite_color = favourite_colour;
  };
};

var person_2nd_Plamen = new person_2nd("Plamen", "Dobrev", 14, "blue");
person_2nd_Plamen.new_favourite_color("red");
document.write(person_2nd_Plamen.name + "<br />" + person_2nd_Plamen.surname + "<br />" + person_2nd_Plamen.age + "<br />" + person_2nd_Plamen.favourite_colour);




function person_3rd(name, surname, age, favourite_colour) {
  this.name = name;
  this.surname = surname;
  this.age = function(age) {
    this.age = age;
  };
  this.favourite_colour = favourite_colour;
};

var person_3rd_Plamen = new person_3rd("Plamen", "Dobrev", 14, "blue");
person_3rd_Plamen.age(15);
document.write(person_3rd_Plamen.name + "<br />" + person_3rd_Plamen.surname + "<br />" + person_3rd_Plamen.age + "<br />" + person_3rd_Plamen.favourite_colour);



function person_4th(name, surname, age, favourite_colour) {
  this.name = name;
  this.surname = surname;
  this.age = new_age;
  this.favourite_colour = favourite_colour;
};

function new_age() {
  return 15;
};

var person_4th_Plamen = new person_4th("Plamen", "Dobrev", 14, "blue");
document.write(person_4th_Plamen.name + "<br />" + person_4th_Plamen.surname + "<br />" + person_4th_Plamen.age + "<br />" + person_4th_Plamen.favourite_colour);

Answer 1

Попробуйте что-то вроде этого для понимания:

function Person() {
  this.name;
  this.surname;
  this.age;
  this.favourite_colour;
  this.assign = function(n, s, a, fc) {
    this.name = n;
    this.surname = s;
    this.age = a;
    this.favourite_colour = fc;
  }
}
var p = new Person(); // create object
p.assign("Plamen", "Dobrev", "18", "blue")
alert(p.name);

var p = [];
p.push(new Person());
p[0].assign("Plamen", "Dobrev", "18", "blue"); // first index
alert(p[0].age); // get age of first index for example

Answer 2

Пламена. Рад, что вы проявляете интерес к веб-разработке и JavaScript, надеюсь, вы многому научитесь.

Как указали некоторые участники, вы неправильно написали слово `color - нажмите F12 в вашем браузере, чтобы открыть консоль, и вы получите полезные подсказки при возникновении ошибки. Вы также можете записывать данные непосредственно в консоль из своего кода JavaScript:

console.log("Hi, Plamen!");

Есть некоторые действительно интересные вещи, которые мы можем сделать в JavaScript, ваш код великолепен, но мы могли бы привести его в порядок и сделать его круче. Самое замечательное в нашей объектной функции в том, что нам действительно нужен только один из них. Мы можем использовать его для создания нескольких экземпляров объекта, у вас может быть одна person функция, например:

function person(name, surname, age, favourite_color) {
    this.name = name;
    this.surname = surname;
    this.age = age;
    this.favourite_color = favourite_color;
}

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

person_1 = new person("My name", "My surname", 38, "blue");
person_2 = new person("Your name", "Your surname", 123, "magenta");
person_3 = new person("Someone", "else", 4321, "purple");

document.write("Person 1 name: " + person_1.name + " " + person_1.surname);
document.write("Person 2 name: " + person_2.name + " " + person_2.surname);
document.write("Person 3 name: " + person_3.name + " " + person_3.surname);

// Or, view output in console

console.log("Person 1 name: " + person_1.name + " " + person_1.surname);
console.log("Person 2 name: " + person_2.name + " " + person_2.surname);
console.log("Person 3 name: " + person_3.name + " " + person_3.surname);

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

function person(name, surname, age, favourite_color) {
    this.name = name;
    this.surname = surname;
    this.age = age;
    this.favourite_color = favourite_color;

    this.changeFavouriteColor = function(color) {
        this.favourite_color = color;
    };

    this.changeAge = function(age) {
        this.age = age;
    };
};

person_1 = new person("me", "misturr", 20, "orange");
person_2 = new person("him", "surrr", 50, "yellow");

person_1.changeAge(21);
person_2.changeFavouriteColor("green");

console.log(`${person_1.name} is ${person_1.age} years old`);
console.log(`${person_2.name}'s favourite color is ${person_2.favourite_color}`);

JavaScript довольно крутой, надеюсь, вам будет весело и узнать больше.

Answer 3

Здорово, что вы заинтересованы в изучении Javascript!Как упомянуто в комментариях @aug, браузер-консоль - отличный инструмент, чтобы выяснить, что происходит не так.В этом случае вы получаете ошибку типа: Uncaught TypeError: person_2nd_Plamen.new_favourite_color is not a function

В этом случае вы написали color по-разному в разных местах.Несколько раз вы написали это color, а другие colour.

function person_2nd(name, surname, age, favourite_colour) {
  this.name = name;
  this.surname = surname;
  this.age = age;
  this.favourite_colour = favourite_colour;
  this.new_favourite_colour = function(favourite_colour) {
    this.favourite_colour = favourite_colour;
  }
};

var person_2nd_Plamen = new person_2nd("Plamen", "Dobrev", 14, "blue");
person_2nd_Plamen.new_favourite_colour("red");
document.write(
  person_2nd_Plamen.name + "<br />" + 
  person_2nd_Plamen.surname + "<br />" + 
  person_2nd_Plamen.age + "<br />" + 
  person_2nd_Plamen.favourite_colour
);
console.log(person_2nd_Plamen);