JavaScript 对象方法
JavaScript 对象方法
实例
var person = {
firstName: "Bill",
lastName : "Gates",
id : 648,
fullName : function() {
return this.firstName + " " + this.lastName;
}
};
完整实例：
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript <b>this</b> 关键词</h2>
<p>在本例中，<b>this</b> 代表 <b>person</b> 对象。</p>
<p>因为 person 对象“拥有” fullName 方法。</p>
<p id="demo"></p>
<script>
// 创建对象：
var person = {
firstName: "Bill",
lastName : "Gates",
id : 678,
fullName : function() {
return this.firstName + " " + this.lastName;
}
};
// 显示来自对象的数据：
document.getElementById("demo").innerHTML = person.fullName();
</script>
</body>
</html>
运行结果：
Javascript this 关键词 在本例中，this 代表 person 对象。 因为 person 对象“拥有” fullName 方法。 Bill Gates
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
JavaScript 方法
JavaScript 方法是能够在对象上执行的动作。
JavaScript 方法是包含函数定义的属性。
| 属性 | 值 |
|---|---|
| firstName | Bill |
| lastName | Gates |
| age | 62 |
| eyeColor | blue |
| fullName | function() {return this.firstName + " " + this.lastName;} |
方法是存储为对象属性的函数。
this 关键词
在 JavaScript 中，被称为 this 的事物，指的是拥有该 JavaScript 代码的对象。
this 的值，在函数中使用时，是“拥有”该函数的对象。
请注意 this 并非变量。它是关键词。您无法改变 this 的值。
访问对象方法
请使用如下语法创建对象方法：
methodName : function() { 代码行 }
请通过如下语法来访问对象方法：
objectName.methodName()
您通常会把 fullName() 描述为 person 对象的方法，把 fullName 描述为属性。
fullName 属性在被通过 () 调用后会以函数形式执行。
此例访问 person 对象的 fullName() 方法：
示例代码：
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>
运行结果：
Javascript 对象方法 对象方法是一种函数定义，存储为属性值。 Bill Gates
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
如果您访问 fullName 属性时没有使用 ()，则将返回函数定义：
示例代码：
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>
运行结果：
Javascript 对象方法
如果您不使用 () 访问对象，则返回函数定义：
function() { return this.firstName + " " + this.lastName; }
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
使用内建方法
此例使用 String 对象的 toUpperCase() 方法，把文本转换为大写：
var message = "Hello world!";
var x = message.toUpperCase();
x 的值，在以上代码执行后将是：
HELLO WORLD!添加新的方法
向对象添加方法是在构造器函数内部完成的：
示例代码：
function person(firstName, lastName, age, eyeColor) {
this.firstName = firstName;
this.lastName = lastName;
this.age = age;
this.eyeColor = eyeColor;
this.changeName = function (name) {
this.lastName = name;
};
}
changeName() 函数 name 的值赋给了 person 的 lastName 属性。
现在您可以尝试：
myMother.changeName("Jobs");
完整实例：
<!DOCTYPE html>
<html>
<body>
<p id="demo"></p>
<script>
var person = {
firstName: "Bill",
lastName : "Gates",
id : 678,
};
person.name = function() {
return this.firstName + " " + this.lastName;
};
document.getElementById("demo").innerHTML =
"My friend is " + person.name();
</script>
</body>
</html>
运行结果：
My friend is Bill Gates
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
通过用 myMother “替代” this，JavaScript 清楚您指的是哪个 person。
