函数的上下文规律 ----this指向

Posted Joyce前端

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了函数的上下文规律 ----this指向相关的知识,希望对你有一定的参考价值。

首先说下什么是函数的上下文呢?简单来说就是this指向,在日常工作我们会遇到this经常被修改成window 或者别的对象了,这都是怎么造成的呢。

根据平常写代码的经验,我总结了以下几种规律。

1.函数用圆括号调用,函数的上下文是window对象

请看下面代码

function fun(){
    var a = 200;
    alert(this.a);
}

var a = 6666;
fun();

这个fun函数的上下文是什么呢?这个弹出来什么取决于这个this是什么。

这个函数是什么不重要,重要的是怎么调用的,用圆括号调用,此时上下文指的就是window。即弹出6666;

2.如果函数作为一个对象的方法,对象打点调用,函数的上下文对象就是这个对象。

请看下面代码

function fun(){
    
    alert(this.a);
}

var obj = {
    "a" : 12,
    "b" : 2,
    "c" : fun
}

obj.c();

对象.函数();

这时函数的上下文是obj ,弹出12。

3.函数是事件处理函数,函数的上下文就是这个触发事件的对象。

        
<<script>
    //函数
    function fun(){
        this.style.background = "yellow";
    }
    var box1 = document.getElementById("box1");
    var box2 = document.getElementById("box2");
    var box3 = document.getElementById("box3");
    btn.onclick = fun;
</script>

这个函数只有点击的时候回执行,点击谁,谁就是this。

4.定时器调用,函数的上下文是window。

平常工作中经常用到定时器

var a = 456;
setInterval(function(){
   var a = 123;
    alert(this.a)
}, 1000)

此时弹出是456;

在定时器外面的事件处理函数中,可以用var self= this,或者_this = this ,改变this指向。

5.数组中存放的函数,被数组索引调用,那么这个上下文就是这个数组。

function fun(){

    alert(this === arr);
    alert(arr.length);
}
var arr = [fun,2,3424,5];
arr[0]();

此时这个函数是从数组中枚举出来的,最终调用是这个数组,所以上下文就是这个数组。

 

面试也经常考这类的题目

比如

function fun(m,n,o,p,q){
  alert(this.length);
    
}

function f(){
    arguments[0](1,2,3,4,5)
}

f(fun,5,6,7)
4
这个this 是调用这个函数的 argument, 弹出来就是实参个数 4。
如果是arguments.callee 呢  那就是形参个数。
 

以上是关于函数的上下文规律 ----this指向的主要内容,如果未能解决你的问题,请参考以下文章

第二十天学习进度--规律寻找算法之傅里叶级数拟合周期函数

shuffle函数打乱顺序有规律吗

product函数计算规律

计蒜客 函数规律

BZOJ 1228 E&G(sg函数+找规律)

量化投资学习-38:通过非线性函数的极值看股市的运行规律