现在的位置: 首页 > web前端 > 正文

改变JS中的this指向的方法

2019年11月12日 web前端 ⁄ 共 1005字 ⁄ 字号 评论关闭

  JS的this指向

  正常函数的this指向

  1.全局调用 函数名( ) 指向 window

  2.对象调用 对象.函数名( ) 谁调用指向谁 (.前面是谁就指向谁)

  3.自执行的函数 指向window

  4.事件处理函数 指向事件源

  5.定时器处理函数 指向事件源

  6.函数定义了未调用的时候指向不确定

  强行改变this指向的方法

  call( )

  语法:

  函数名.call(你要改变的函数的 this 指向, 第二个参数开始,依次是给函数传递的参数)

  会直接把函数给调用

  第一个参数如果不写或者写一个 null,表示 window

  语法: 函数名.call(你要改变的函数的 this 指向, 第二个参数开始,依次是给函数传递的参数) 会直接把函数给调用 第一个参数如果不写或者写一个 null,表示 window

  let a = 10; function fn(b) { console.log(this); console.log(b); } fn.call(a,"gg"); //Number {10} 直接调用

  apply()

  语法: 函数名.apply(你要改变的函数的 this 指向,第二个参数是一个数组(只能有俩个参数) 数组里面每一项依次是给函数传递参数) 会直接把函数给调用

  let a = 10;

  function fn(b,c) {

  console.log(this);

  console.log(b);

  console.log(c);

  }

  fn.apply(a,["bb","cc"]); //Number {10} 直接调用

  call ( ) 和 apply ( ) 的方法实际上功能是一样的,只是传入的参数列表形式不同。

  bind()

  语法:

  函数名.bind(你要改变的函数的 this 指向)

  不会立即执行函数

  返回值: 就是一个函数(只不过是一个被改变好了 this 指向的函数)

  他对函数的参数传递有两个方式

  1. 调用返回的函数的时候传递

  2. 直接从第二个参数开始依次传递

  let a = 10;

  function fn(b,c) {

  console.log(this);

  console.log(b);

  console.log(c);

  }

  var fn1=fn.bind(a,"bb","cc"); //返回的是改好指向的函数 并没有调用

  fn(); // window 原来函数的指向是不会改变的

  fn1(); //Number {10}

抱歉!评论已关闭.