前端进阶-类和对象

对象可以表示数据和功能。

构造函数

构造函数：结构和语法

function SoftwareDeveloper() {
   
  this.favoriteLanguage = 'JavaScript';
}

首先，构造函数并不声明局部变量，而是使用 this 关键字来保存数据。以上函数将为所创建的任何对象添加一个 favoriteLanguage 属性，并为其分配一个默认值 'JavaScript'。现在不用太在意构造函数中的 this；只要知道 this 是指在构造函数前面使用 new 关键字创建的新对象即可。

最后一点比较特别的是，这个函数似乎不会返回任何东西！JavaScript 中的构造函数不应该有一个显式的返回值（即使用 return 语句）。

创建一个新的对象

function SoftwareDeveloper() {
   
	this.favoriteLanguage = 'JavaScript';
}
let developer = new SoftwareDeveloper();
console.log(developer);
// SoftwareDeveloper {this.favoriteLanguage: "JavaScript"}

function SoftwareDeveloper(name) {
   
  this.favoriteLanguage = 'JavaScript';
  this.name = name;
}
let instructor = new SoftwareDeveloper('Andrew');
console.log(instructor);
// SoftwareDeveloper { favoriteLanguage: 'JavaScript', name: 'Andrew' }

注意，大写构造函数名称的第一个字母只是一个命名惯例。虽然第一个字母应该大写，但如果不小心用了小写，也仍然还是构造函数（即当用 new 运算符调用时，等等）。

查看对象的构造函数 (instanceOf)

function Developer(name) {
   
	this.name = name;
}
const dev = new Developer('Veronika');
typeof dev // "object"
dev instanceOf Developer; // true 

new 运算符
instanceOf 运算符

当在对象上调用方法时，this 会被赋值，并且其值指向该对象。由于它是一个保留字，因此不应该用作任何变量名称、函数名称等。

关键字 this

根据 this 的调用方式，分析 this 指代的含义：

如果使用 new 运算符来调用构造函数，this 的值将被设置为新创建的对象。如果在对象上调用方法，this 将被设置为该对象本身。如果简单地调用一个函数，this 将被设置为全局对象：window。

this 运算符

设置自己的 this 值

Javascript 提供了几种设置 this 值的方法，这些方法分别是 call() 、apply() 和 bind()。前两种方法在函数上被调用，会因为参数的传入方式不同而有所不同。第三种方法是返回新函数的方法，每种方法都在不同的环境中使用。

call()

call() 是一个直接调用到函数上的方法。我们传递给它一个单一的值，以设置为 this 的值，然后逐个传入该函数的任何参数，用逗号分隔。

function multiply(n1, n2) {
   
  return n1 * n2;
}
multiply(3, 4);
// 12
multiply.call(window, 3, 4);
// 12

除了调用常规函数之外，我们如何调用附加到对象上的函数（即方法）呢？

使用 call() 来调用方法允许我们从对象中“借用”方法，然后将其用于另一个对象！