JavaScript 对象方法

实例

<!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">
<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>

运行一下

this关键字

在函数定义中，这是指函数的“所有者”。

在上面的示例中， this 是拥有fullName函数的person对象。

换句话说，this.firstName意味着这个对象的firstName属性。

阅读更多请访问本站的 JavaScript this 关键词。

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 的值。

访问对象方法

使用以下语法访问对象方法：

objectName.methodName（）

通常将fullName（）描述为person对象的方法，将fullName描述为属性。

fullName属性将在用（）调用时执行（作为函数）。

此示例访问person对象的fullName（）方法：

<!DOCTYPE html>
<html>
<body>
<h2>JavaScript 对象</h2>
<p>创建并应用对象方法</p>
<p>方法实际上是存储为属性值的函数定义。</p>
<p id="demo"></p>
<script>
const person = {
  firstName: "John",
  lastName: "Doe",
  id: 5566,
  fullName: function() {
    return this.firstName + " " + this.lastName;
  }
};
document.getElementById("demo").innerHTML = person.fullName();
</script>
</body>
</html>

运行一下

如果访问fullName属性，而不使用（），它将返回函数定义：

<!DOCTYPE html>
<html>
<body>
<h2>JavaScript 对象</h2>
<p>方法实际上是存储为属性值的函数定义。</p>
<p>如果访问fullName属性，而不使用（），它将返回函数定义：</p>
<p id="demo"></p>
<script>
const person = {
  firstName: "John",
  lastName: "Doe",
  id: 5566,
  fullName: function() {
    return this.firstName + " " + this.lastName;
  }
};
document.getElementById("demo").innerHTML = person.fullName;
</script>
</body>
</html>

运行一下

向对象添加方法

向对象添加新方法很简单：

<!DOCTYPE html>
<html>
<body>
<h2>JavaScript 对象</h2>
<p id="demo"></p>
<script>
const person = {
  firstName: "John",
  lastName: "Doe",
  id: 5566,
};
person.name = function() {
  return this.firstName + " " + this.lastName;
};
document.getElementById("demo").innerHTML =
"我的父亲是 " + person.name();
</script>
</body>
</html>

运行一下

使用内置方法

向对象添加方法是在构造器函数内部完成的：

此示例使用String对象的 toUpperCase() 方法将文本转换为大写：

var message = "Hello world!";
var x = message.toUpperCase();

执行上述代码后，x的值为：

HELLO WORLD!

<!DOCTYPE html>
<html>
<body>
<h2>JavaScript 对象</h2>
<p id="demo"></p>
<script>
const person = {
  firstName: "John",
  lastName: "Doe",
  id: 5566,
};
person.name = function() {
  return (this.firstName + " " + this.lastName).toUpperCase();
};
document.getElementById("demo").innerHTML =
"我的父亲是 " + person.name();
</script>
</body>
</html>

运行一下

JavaScript 对象方法

实例

this关键字

JavaScript 方法

this 关键词

访问对象方法

向对象添加方法

使用内置方法

分类导航