首页 > web前端 > js教程 > 'this”关键字在 JavaScript 对象文本中的行为如何?

'this”关键字在 JavaScript 对象文本中的行为如何?

Susan Sarandon
发布: 2024-12-18 12:31:18
原创
457 人浏览过

How Does the

理解 JavaScript 对象文字中的“this”关键字

在 JavaScript 的对象文字中,“this”关键字的行为可能非常不同来自其他编程语言。下面是其工作原理的全面说明。

调用时绑定

与其他后期绑定语言不同,JavaScript 在调用时而不是在编译期间绑定“this”时间或运行时间。这意味着“this”的值取决于函数的调用方式。

绑定规则

JavaScript 对象文本中“this”的绑定规则如下如下:

  1. 构造函数调用:当使用“new”关键字,“this”关键字绑定到新创建的对象。
  2. 对象方法: 当作为对象方法调用时,“this”绑定到该方法所属的对象,这是最后一个点之前的对象。
  3. 全局范围:在任何函数之外或者如果在没有任何对象上下文的情况下调用函数, “this”绑定到全局对象,biasanya disebut“window”dalam Web 浏览器。
  4. 事件处理程序: 在事件处理程序中,“this”通常绑定到触发事件的 DOM 元素.
  5. Call() 和 Apply() 方法: “call()”和“apply()”方法可用于显式地将“this”分配给任何对象,从而允许一个对象访问另一个对象的方法。
  6. Function.bind():“函数” .bind()”方法还可以用于显式地将“this”绑定到特定对象,从而创建一个具有所需功能的新函数实例绑定。

示例用例

说明不同的绑定规则:

const obj = {
  foo: "Foo",
  bar() {
    console.log(this.foo); // "Foo" - "this" refers to the object
  },
};

obj.bar(); // Calls the method, binding "this" to the object
登录后复制
function MyDate(date) {
  this.date = date;
}

const obj1 = {
  foo: new Date(),
  bar: new MyDate(this.foo), // Error: this.foo is undefined
};

const obj2 = {
  foo: new Date(),
  bar: new MyDate(obj2.foo), // Works: "this" refers to obj2
};
登录后复制

在第一个示例中, “this”引用对象“obj”,因为该方法被作为对象方法调用。在第二个示例中,“this”在“obj1”中未定义,因为该函数是在没有任何对象上下文的情况下调用的。在“obj2”中,“this”指的是“obj2”,因为该函数是使用“this”对象显式调用的。

以上是'this”关键字在 JavaScript 对象文本中的行为如何?的详细内容。更多信息请关注PHP中文网其他相关文章!

来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
作者最新文章
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板