我是靠谱客的博主 健壮花生,最近开发中收集的这篇文章主要介绍函数内部--arguments、this、caller、new.target,觉得挺不错的,现在分享给大家,希望可以做个参考。

概述

概述

arguments和this是ES5里面函数内部两个特殊的对象;
caller是函数对象上的一个属性,也是ES5添加的这个属性;
new.target是ES6新增的,用来检测函数是否使用new关键字调用;

arguments

arguments是一个类数组对象,包含调用函数时传入的所有参数,这个对象只有以function关键字定义函数时才会有(因此箭头函数就没有这个对象)。arguments对象有一个属性:callee,这个属性是一个指向arguments对象所在函数的指针。

function factorial(num){
    console.log(arguments)
    if(num <= 1){
        return 1;
    }else{
        return num * arguments.callee(num - 1)//之前arguments.callee是factorial
    }
}

在上面的例子中,arguments.callee就指向factorial这个函数。因此就相当于调用了这个函数。但是这种方式,可以让函数逻辑与函数名解耦,就算函数名称改变了,它依然表示那个函数。

this

this在标准函数和箭头函数中是不一样的。

标准函数中的this

在全局作用域中,this指向的是全局对象;即在全局上下文中调用函数时,this指向全局对象

color = 'red';
function sayColor(){
    console.log(this.color)
}
sayColor() //red

在函数作用域中,this引用的是把函数当成方法调用的上下文对象。即如果这个函数是通过一个对象的属性来调用的话,那么this指向这个对象。要是直接调用这个函数,那么this还是指向全局对象。所以this的指向要等到函数被调用时才能确定。

color = 'red';
let obj = {
    color:'blue',
    sayColor:function sayColor(){
        console.log(this.color)
    }
}
let a = obj.sayColor;
a() //red
obj.sayColor()//blue

在上面的例子,要是obj.sayColor赋值给一个变量,然后再调用,那么相当于直接调用这个函数,指向全局,要是直接调用obj的sayColor属性,那么就会指向obj.

箭头函数中的this

和标准函数相比,箭头函数的this指向就会好判断一些,标准函数要根据函数什么时候、在哪里调用,箭头函数的this指向不看调用,在哪里定义箭头函数,那么箭头函数的this就指向定义它的上下文。
在事件回调或者定时回调中调用某个函数,可以使用箭头函数,this会保留定义该函数时的上下文。

function name1(){
    this.name = 'wu'
    setTimeout(() => console.log(this.name),1000)
}
name1() //wu
function name2(){
    this.name = 'wu'
    setTimeout(function(){console.log(this.name)},1000)
}
name2() //undefined

caller

caller引用的是调用当前函数的函数。如果是在全局作用域中调用的则为null。

function one(){
    two()
}
function two(){
    console.log(two.caller)
}
one()//function one

因为function one里面调用了function two,所以two.caller就指向的是one。

在严格模式下,访问arguments.callee会报错,而且不可以给函数的caller赋值

new.target

new.target是es6新增的,可以检测函数是否使用new关键字调用
如果函数是正常调用,那么new.target的值是undefined;如果是使用new关键字调用的,那么new.target会引用被调用的构造函数。

function test(){
    if(!new.target){
        console.log('test没有使用new关键字调用')
    }else{
        console.log('test是使用new关键字调用的')
    }
}
test()//test没有使用new关键字调用
new test()//test是使用new关键字调用的

最后

以上就是健壮花生为你收集整理的函数内部--arguments、this、caller、new.target的全部内容,希望文章能够帮你解决函数内部--arguments、this、caller、new.target所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(48)

评论列表共有 0 条评论

立即
投稿
返回
顶部