Skip to main content

对象

生活中的对象​

比如是一辆汽车：

属性： 

car.name = porsche
// 汽车品牌
car.model = 911
// 汽车型号
car.length = 4499mm
// 汽车长度
car.color = white
// 汽车颜色

方法： 

car.start()
// 启动
car.drive()
// 行驶
car.brake()
// 刹车
car.stop()
// 停车

JS 对象​

在 JavaScript 中，一个变量是这样的： 

var car = "porsche";

然而，当某样东西有多种属性时，我们怎么处理呢？答案是使用对象。
对象也是变量。但是对象包含很多值。
这段代码把多个值（porsche, 911, white）赋给名为 car 的变量： 

var car = {type:"porsche", model:"911", color:"white"};

对象属性​

（JavaScript 对象中的）名称:值对被称为属性。 

var person = {firstName:"Bill", lastName:"Gates", age:62, eyeColor:"blue"};
属性属性值
firstNameBill
lastNameGates
age62
eyeColorblue

对象方法​

对象也可以有方法。
方法是在对象上执行的动作。
方法以函数定义被存储在属性中。 

var person = {
  firstName: "Bill",
  lastName : "Gates",
  id       : 678,
  fullName : function() {
    // 这是一个名叫 fullName 的对象方法
    return this.firstName + " " + this.lastName;
  }
};

this 关键词​

在函数定义中，this 引用该函数的“拥有者”。
在上面的例子中，this 指的是“拥有” fullName 函数的 person 对象。
换言之，this.firstName 的意思是 this 对象的 firstName 属性。也就是说可以通过 this 来访问这个对象的其他属性。

访问对象属性​

您能够以两种方式访问属性：

objectName.propertyName

或者

objectName["propertyName"]

例子 1

person.lastName;

例子 2

person["lastName"];

实例： 

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript 对象属性</h1>

<p>有两种不同的方法来访问对象属性。</p>

<p>您可以使用 person.property 或 person["property"]。</p>

<p id="demo"></p>

<script>
// 创建对象：
var person = {
    firstName: "Bill",
    lastName : "Gates",
    id       :  12345
};

// 显示对象中的数据：
document.getElementById("demo").innerHTML = person.firstName + " " + person.lastName;
</script>

</body>
</html>

访问对象方法​

您能够通过如下语法访问对象方法： 

objectName.methodName()

实例 

name = person.fullName();

进一步的例子： 

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript 对象方法</h1>

<p>对象方法是一种函数定义，存储为属性值。</p>

<p id="demo"></p>

<script>
// 创建对象：
var person = {
    firstName: "Bill",
    lastName : "Gates",
    id       : 12345,
    fullName : function() {
       return this.firstName + " " + this.lastName;
    }
};

// 显示对象中的数据：
document.getElementById("demo").innerHTML = person.fullName();
</script>
</body>
</html>