解释这个未捕获的类型错误：对象[对象对象]的属性'x'不是函数

Question

有人可以解释为什么我会在下列每种情况下得到结果吗？我希望理解为什么结果是关于JavaScript如何在范围内工作的结果，如果这是问题所在。在第一个例子中，我的代码正常工作。

var Employees = function(name, salary) { 
    this.name = name; 
    this.salary = salary; 

    this.addSalary = addSalaryFunction; 

    this.getSalary = function() { 
     return this.salary; 
    }; 

}; 

var addSalaryFunction = function(addition) { 
     this.salary = this.salary + addition; 
    }; 


var ceo = new Employees("Chris", 400000); 
ceo.addSalary(20000); 
document.write(ceo.getSalary()); 

如果我移动addSalaryFunction到Employees功能，以下this.addSalary我得到的遗漏的类型错误。

var Employees = function(name, salary) { 
    this.name = name; 
    this.salary = salary; 

    this.addSalary = addSalaryFunction; 

    this.getSalary = function() { 
     return this.salary; 
    }; 

    var addSalaryFunction = function(addition) { 
     this.salary = this.salary + addition; 
    }; 
}; 

var ceo = new Employees("Chris", 400000); 
ceo.addSalary(20000); 
document.write(ceo.getSalary()); 

但是，如果我移动addSalaryFunction上述this.addSalary如果工作正常试。尽管我的IDE告诉我，我的本地变量addSalaryFunction是多余的。

var Employees = function(name, salary) { 
    this.name = name; 
    this.salary = salary; 

    var addSalaryFunction = function(addition) { 
     this.salary = this.salary + addition; 
    }; 

    this.addSalary = addSalaryFunction; 

    this.getSalary = function() { 
     return this.salary; 
    }; 

}; 


var ceo = new Employees("Chris", 400000); 
ceo.addSalary(20000); 
document.write(ceo.getSalary()); 

Answer 1

这是因为您正在尝试在创建函数之前分配函数。

this.addSalary = addSalaryFunction; // there's no function yet 

//... 

var addSalaryFunction = function(addition) { // now there is, but too late 
    this.salary = this.salary + addition; 
}; 

---

当你移动的变量赋值的​​以上，现在你想引用它之前创造的功能。

var addSalaryFunction = function(addition) { // here's the function 
    this.salary = this.salary + addition; 
}; 
this.addSalary = addSalaryFunction; // now we can assign it 

---

如果你曾经使用函数声明的语法来代替，第一个版本会的工作，因为函数声明“悬挂” （他们说）的变量范围的顶部。

this.addSalary = addSalaryFunction; // This now works because of the magic below 

//... 

// This is magically hoisted to the top 
function addSalaryFunction(addition) { 
    this.salary = this.salary + addition; 
} 

Answer 2

第二种方法不起作用，因为addSalaryFunction在声明之前被引用。

您可以消除一些代码，只是声明：

this.addSalary = function(addition) { 
    this.salary = this.salary + addition; 
} 

Answer 3

在一个更简单的形式：

var foo = function() { 
    var x = y; 
    var y = 2; 
    return x; 
}; 

var bar = function() { 
    var y = 2; 
    var x = y; 
    return x; 
}; 

显然，bar()将返回2. foo，然而，得到undefined在查找第一行的值为y，所以返回undefined。虽然变量声明被悬挂在其范围的顶部，但变量初始值没有。

Answer 4

这是一个具体的吊装问题。看看这个解释：http://www.sitepoint.com/back-to-basics-javascript-hoisting/