基本的JS对象（字面量对象）

基本的JS对象（字面量对象）

一、创建对象（字面量对象）

1
2
3
4

let duck = {
    name: "Aflac",
    numLegs: 2
}

这个 duck 对象有两组键值对：一个是 name 属性，它的值是 Aflac；另一个是 numLegs 属性，它的值是 2。

二、访问对象

1
2
3
4
5

let duck = {
    name: "Aflac",
    numLegs: 2
};
console.log(duck.name); // Aflac

可以用 点号表示法 来访问对象的属性，duck 后面加上点号以及属性名 name，来访问到 Aflac。

三、在对象上创建方法

对象可以有一个叫做 method 的特殊属性。

方法属性也就是函数。 这给对象添加了不同的行为。

以下就是一个带有方法属性的 duck 示例：

1
2
3
4
5
6

let duck = {
  name: "Aflac",
  numLegs: 2,
  sayName: function() {return "The name of this duck is " + duck.name + ".";}
};
duck.sayName(); // The name of this duck is Aflac.

四、使用 this 关键字提高代码重用性

1

sayName: function() {return "The name of this duck is " + duck.name + ".";}

虽然这是访问对象属性的有效方法，但是这里有一个陷阱。

如果变量名发生了改变，那么引用了原始名称的任何代码都需要更新。

在一个简短的对象定义中，这并不是问题，但是如果对象有很多对其属性的引用，那么发生错误的可能性就更大了。

可以使用 this 关键字 来避免这一问题：

1
2
3
4
5

let duck = {
  name: "Aflac",
  numLegs: 2,
  sayName: function() {return "The name of this duck is " + this.name + ".";}
};

this 是一个很复杂的知识点，而上面那个例子也只是使用它的一种方法而已。

在当前的上下文环境中，this 指向的就是与这个方法有关联的 duck 对象。

如果把对象的变量名改为 mallard，那使用 this 后就没有必要在代码中找到所有指向 duck 的部分。

这样可以使得代码更具有可读性和复用性。

总结

字面量对象很简洁，但是不够灵活，因为不能传参

此页面上有什么