2023-02-26 this相关

1.this的常见绑定情况\

1.1 默认绑定

独立的函数调用我们可以理解成函数没有被绑定到某个对象上进行调用;

1.2 隐式绑定

它的调用位置中,是通过某个对象发起的函数调用

1.3 显式绑定

明确的绑定了this指向的对象,所以称之为 显式绑定。

JavaScript所有的函数都可以使用call和apply方法。

第一个参数是相同的,要求传入一个对象;调用这个函数时,会将this绑定到这个传入的对象上。

后面的参数,apply为数组,call为参数列表;

bind方法

一个函数总是显示的绑定到一个对象上

  • 使用bind方法,bind() 方法创建一个新的绑定函数(bound function,BF);
  • 绑定函数是一个 exotic function object(怪异函数对象)
  • 在 bind() 被调用时,这个新函数的 this 被指定为 bind() 的第一个参数,而其余参数将作为新函数的参数,供调用时使用。
const person = {
  firstName: 'John',
  lastName: 'Doe',
  getFullName: function() {
    return `${this.firstName} ${this.lastName}`;
  }
};

const getFullName = person.getFullName.bind(person);

console.log(getFullName()); // output: "John Doe"

2. 规则优先级

  • 1.默认规则的优先级最低
    毫无疑问,默认规则的优先级是最低的,因为存在其他规则时,就会通过其他规则的方式来绑定this

  • 2.显示绑定优先级高于隐式绑定

  • 3.new绑定优先级高于隐式绑定

  • 4.new绑定优先级高于bind

this规则之外

情况一: 如果在显示绑定中,我们传入一个null或者undefined,那么这个显示绑定会被忽略,使用默认规则:
情况二: 创建一个函数的 间接引用,这种情况使用默认绑定规则

赋值(obj2.foo = obj1.foo)的结果是foo函数;

foo函数被直接调用,那么是默认绑定;

3. 箭头函数

箭头函数不会绑定this、arguments属性;

箭头函数不能作为构造函数来使用(不能和new一起来使用,会抛出错误);

箭头函数的优化

  1. 如果只有一个参数()可以省略
  1. 如果函数执行体中只有一行代码, 那么可以省略大括号
  1. 如果函数执行体只有返回一个对象, 那么需要给这个对象加上()
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容