如何在 JavaScript 中调用对象内部的函数
我们可以通过将函数声明为对象的属性并调用它来调用对象内部的函数,例如 obj.sum(2, 2)
。 一个对象的属性可以指向一个函数,就像它可以指向一个字符串、数字或其他值一样。
const obj = {
sum(a, b) {
return a + b;
},
};
console.log(obj.sum(10, 10)); // 👉️ 20
console.log(obj.sum(10, 20)); // 👉️ 30
我们在一个对象上声明了一个 sum
属性。 该属性指向一个函数。
const obj = {
sum(a, b) {
return a + b;
},
};
console.log(typeof obj.sum); // 👉️ "function"
我们可以使用点访问对象的属性。 或括号
[]
符号来调用函数。
我们使用简写属性来定义对象中的函数。
在阅读旧代码时,我们可能会看到使用了以下更冗长和过时的方法。
const obj = {
sum: function (a, b) {
return a + b;
},
};
console.log(obj.sum(10, 10)); // 👉️ 20
console.log(obj.sum(10, 20)); // 👉️ 30
第一种方法更简洁,更易于阅读。
我们可以使用 this
关键字在函数内部访问对象的属性。
const obj = {
num: 100,
sum(a, b) {
return a + b + this.num;
},
};
console.log(obj.sum(1, 1)); // 👉️ 102
在此特定上下文中,this
关键字指的是对象。
我们还可以在对象声明后向其添加一个函数。
const obj = {
num: 100,
};
obj.sum = function (a, b) {
return a + b + this.num;
};
console.log(obj.sum(10, 10)); // 👉️ 120
请注意
,我们使用function
关键字来定义函数。 如果我们使用箭头函数,则this
关键字的值将不会被正确绑定并且会指向封闭范围(而不是对象)。
const obj = {
num: 100,
};
obj.sum = (a, b) => {
console.log(this); // 👉️ {}
return a + b + this.num;
};
console.log(obj.sum(10, 10)); // 👉️ NaN
箭头函数不像命名函数那样有自己的 this
关键字。 相反,箭头函数使用封闭范围的 this
上下文。
相关文章
使用 CSS 和 JavaScript 制作文本闪烁
发布时间:2023/04/28 浏览次数:146 分类:CSS
-
本文提供了使用 CSS、JavaScript 和 jQuery 使文本闪烁的详细说明。
在 PHP 变量中存储 Div Id 并将其传递给 JavaScript
发布时间:2023/03/29 浏览次数:69 分类:PHP
-
本文教导将 div id 存储在 PHP 变量中并将其传递给 JavaScript 代码。
在 JavaScript 中从字符串中获取第一个字符
发布时间:2023/03/24 浏览次数:93 分类:JavaScript
-
在本文中,我们将看到如何使用 JavaScript 中的内置方法获取字符串的第一个字符。
在 JavaScript 中获取字符串的最后一个字符
发布时间:2023/03/24 浏览次数:141 分类:JavaScript
-
本教程展示了在 javascript 中获取字符串最后一个字符的方法