Javascript 为什么新对象一直未定义？

为什么我的对象

newEmp

没有定义？

我正在尝试创建这个“员工管理系统”

单击Add New Employee（添加新员工）按钮，会出现一个调用

addNew（）

addNew（）

执行以下操作：

e.preventDefault（）

获取表单输入的值

通过

Employee（）

构造函数将它们分配到新对象中 功能

完成后，我检查新对象的值-

newEmp

控制台告诉我：

“未定义新环境管理计划”

js文件：

html文件：

员工管理系统
开发商
搜索引擎优化
老师
设计师
添加新员工

我刚刚在JSFIDLE上尝试了您的示例，它对我有效，我得到了控制台输出：

Employee{name:“name”，skill:“skill”，title:“developer”}

一定是其他原因导致：

---

我刚刚在JSFIDLE上尝试了您的示例，它对我有效，我得到了控制台输出：

Employee{name:“name”，skill:“skill”，title:“developer”}

一定是其他原因导致：

---

我想我找到了问题所在。 newEmp应该首先在函数中全局赋值，而不是局部赋值， 因此，当我尝试从函数返回一个新值时，它将有一个保存新信息的位置

//Form HTML Elements
var empName = document.getElementById("emp-name");
var empSkill = document.getElementById("emp-skill");
var empTitle = document.getElementById("emp-title");
var addNewEmp = document.getElementById("btn-add-new-emp");

// New Empoyee Object
var newEmp = {};

//Event Listener - add new employee
addNewEmp.addEventListener("click", addNew);


//Adding new Employee
function addNew(e){
    e.preventDefault();

    // 1. Create "newEmp" Object based on newEmployee constructor function
    // 2. Assign the inputs.values inside the "newEmp" Object

    empName = empName.value;
    empSkill = empSkill.value;
    empTitle = empTitle.value;


    newEmp = new Employee(empName, empSkill, empTitle);

    document.getElementById("myForm").reset();
    return newEmp;
}

//New Employee  -  Constructor function
function Employee(name, skill, title) {
    this.name = name;
    this.skill = skill;
    this.title = title;
}

---

我想我发现了问题所在。 newEmp应该首先在函数中全局赋值，而不是局部赋值， 因此，当我尝试从函数返回一个新值时，它将有一个保存新信息的位置

//Form HTML Elements
var empName = document.getElementById("emp-name");
var empSkill = document.getElementById("emp-skill");
var empTitle = document.getElementById("emp-title");
var addNewEmp = document.getElementById("btn-add-new-emp");

// New Empoyee Object
var newEmp = {};

//Event Listener - add new employee
addNewEmp.addEventListener("click", addNew);


//Adding new Employee
function addNew(e){
    e.preventDefault();

    // 1. Create "newEmp" Object based on newEmployee constructor function
    // 2. Assign the inputs.values inside the "newEmp" Object

    empName = empName.value;
    empSkill = empSkill.value;
    empTitle = empTitle.value;


    newEmp = new Employee(empName, empSkill, empTitle);

    document.getElementById("myForm").reset();
    return newEmp;
}

//New Employee  -  Constructor function
function Employee(name, skill, title) {
    this.name = name;
    this.skill = skill;
    this.title = title;
}

---

这是错误的。函数中有一个console.log命令，用于将其打印到控制台。但在控制台中尝试获取newEmp的值，它将为您提供newEmp不可定义错误。函数中有一个console.log命令，用于将其打印到控制台。但在控制台中尝试获取newEmp的值，它将为您提供未定义的newEmp

//Form HTML Elements
var empName = document.getElementById("emp-name");
var empSkill = document.getElementById("emp-skill");
var empTitle = document.getElementById("emp-title");
var addNewEmp = document.getElementById("btn-add-new-emp");

// New Empoyee Object
var newEmp = {};

//Event Listener - add new employee
addNewEmp.addEventListener("click", addNew);


//Adding new Employee
function addNew(e){
    e.preventDefault();

    // 1. Create "newEmp" Object based on newEmployee constructor function
    // 2. Assign the inputs.values inside the "newEmp" Object

    empName = empName.value;
    empSkill = empSkill.value;
    empTitle = empTitle.value;


    newEmp = new Employee(empName, empSkill, empTitle);

    document.getElementById("myForm").reset();
    return newEmp;
}

//New Employee  -  Constructor function
function Employee(name, skill, title) {
    this.name = name;
    this.skill = skill;
    this.title = title;
}