【问题标题】:Object Constructors对象构造函数
【发布时间】:2021-10-22 12:33:33
【问题描述】:

我在构造函数中创建新对象时遇到问题 我的目标是获取用户输入并从中创建一个新对象并使用构造函数推入一个数组。 问题是,当我尝试填充新输入以创建一个新对象时,它只是用未定义的值替换了旧输入。 我的代码:

let Book = document.querySelector("#one");
let Author = document.querySelector("#two");
let Year = document.querySelector("#three");
let Btn = document.querySelector("button");

Btn.addEventListener("click", () => {
  Book = Book.value;
  Author = Author.value;
  Year = Year.value;

  let myLibrary = [];
  function newBook(name, author, year) {
    this.name = name;
    this.author = author;
    this.year = year;
  }
  function addBookToLibrary(book, author, year) {
    const Books = new newBook(book, author, year);
    myLibrary.push(Books);
  }
  addBookToLibrary(Book, Author, Year);
  console.log(myLibrary);
});

【问题讨论】:

    标签: javascript loops object constructor


    【解决方案1】:
     let Book = document.querySelector("#one");
    let Author = document.querySelector("#two");
    let Year = document.querySelector("#three");
    let Btn = document.querySelector("button");
    
    let myLibrary = [];
    
    Btn.addEventListener("click", () => {
    
    
      function newBook(name, author, year) {
        this.name = name;
        this.author = author;
        this.year = year;
      }
      function addBookToLibrary(book, author, year) {
        const Books = new newBook(book, author, year);
        myLibrary.push(Books);
      }
      addBookToLibrary(Book.value, Author.value, Year.value);
      console.log(myLibrary);
    });
    

    上面的代码有两个错误:

    1. 您正在使用let myLibrary = []; 的本地状态,它将在每次点击时创建。应该将其移至更高的级别,以便在每次点击时都能保留所增加的价值。

    2. 您在函数中使用了相同名称的变量,这些变量覆盖了 Dom 引用。

    【讨论】:

      猜你喜欢
      • 2013-10-20
      • 1970-01-01
      • 2014-03-25
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2011-02-20
      • 2017-10-08
      相关资源
      最近更新 更多