博客列表 >改变JS中的this指向的方法

改变JS中的this指向的方法

sodesily
sodesily原创
2019年11月12日 09:02:091081浏览

JS的this指向

正常函数的this指向

1.全局调用  函数名( )   指向 window
2.对象调用   对象.函数名( )    谁调用指向谁  (.前面是谁就指向谁)
3.自执行的函数  指向window
4.事件处理函数   指向事件源
5.定时器处理函数   指向事件源
6.函数定义了未调用的时候指向不确定

强行改变this指向的方法

call( )

    语法:
     函数名.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}  
                                   
声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议