首页 > 其他分享> 文章详细

js函数—隐形参数this

2019-06-01 21:39:32 阅读：264 来源： 互联网

标签：调用 console 函数绑定 js 隐形 foo log

前言

　　this是函数中的隐形参数，它绑定的值取决于函数的调用位置。

this的定义

　　《你不知道的js》中是这样说的：是函数体内的隐式参数，this就是记录函数调用上下文的一个属性。可以在函数体中使用this引用函数的调用上下文。this的绑定关注的是函数的调用位置。

　　调用位置：是函数在调用时的位置，区别于函数声明时的位置。

this的绑定规则

　　this绑定方式取决于函数的调用位置，根据不同的场景，有四中绑定方式（默认、隐式、显示、构造调用中的绑定）。多种情况同时存在时，依靠的是这四中规则的优先级别采用相应的绑定。

　　默认绑定

　　　　当函数不使用任何修饰时直接调用。无论在哪里调用，它指向的都是全局对象（浏览器环境下指向的是window）。注：严格模式下this会绑定到undefined。

function run(){
    console.log(this); //window
    console.log("running");
    function speak(){
        console.log("speak");
        console.log(this);  // window
    }
    return speak;
}
run()();

　　隐形绑定

　　　　当函数拥有上下文对象的时候，隐式绑定规则会把函数调用中的this绑定到这个上下文对象。

// 对象的属性不管以任何形式拥有函数的引用时，通过对象属性调用这个函数时，这个函数当前调用上下文就是这个对象。
function foo(){
    console.log(this.a);
}
var obj = {
    a:1,
    foo:foo
}
obj.foo();  // 1
// 直接上下文：只有最后一层调用影响this的绑定

function foo(){
　　console.log(this.a);
}
var obj1 = {
　　a:1,
　　foo:foo
}
var obj2 = {
　　a:2,
　　obj1:obj1
}
obj2.obj1.foo(); // 1

　　显示绑定

　　　　直接指定this的绑定对象就叫做显示绑定。js中所有函数都从Function.prototype上继承了call和apply这两个方法。他们都是用来显示指定函数执行时其中的this的。

　　　　call和apply的异同：

　　　　　　目的相同：都用来指定函数执行时其中的this。

　　　　　　参数个数和类型不同：apply接收两个参数，第一个是本次执行要绑定在函数this上的值，第二个是一个数组。call接收的是一个参数列表，参数需要一个一个的传，他会把第一个参数绑定到本次执行函数的this上去。

　　　　　　参数的处理：apply会把第二个参数（Array类型）展开后依次传到本次执行的函数中去。call是取第一绑定到this，再把后面的参数依次传入本次执行函数。

注：argument是函数体中的另一个隐式参数。可以在函数体内拿到函数运行时，接收到的实参。它是一个伪数组，其中的元素和实参一 一对应
// 以下输出结果出自chrome
function test(){
    console.log(test.arguments);
}
// apply 数组[1,2,3]被展开分成三个参数 依次传入 test。
test.apply({},[1,2,3]); // Arguments(3) [1, 2, 3, callee: ƒ, Symbol(Symbol.iterator): ƒ]
// call 数组[1,2,3] 作为一个参数传进了test中
test.call({},[1,2,3]); // Arguments [Array(3), callee: ƒ, Symbol(Symbol.iterator): ƒ]

　　常用操作

// 使用call调用数组map方法。

var arr = [1,2,3,4];
Array.prototype.map.call(arr,function(item){
    console.log(item); // 分别输出 1 2 3 4
})

new绑定

　　使用new 操作符调用函数叫做构造调用。函数做构造调用时，其中this的绑定。函数做构造调用时其中有四个默认操作。

　　1，创建一个新的对象。

　　2，这个对象会被执行原型链接（添加到构造函数的原型链的末尾）。

　　3，把当前正在做构造调用的函数中的this绑定到新创建的对象。

　　3，如果函数没有显式的返回其他对象，那么默认返回这个新建的对象。

// 对foo进行构造调用创建一个新的对象
function foo(a){
    this.a = a;
}
var bar = new foo(2);
console.log(bar.a);

　　js中的构造函数

　　　　1，只是使用new操作符调用的普通函数。

　　　　2，不属于某个类，也不会实例化某个类。

　　　　3，所有函数使用new 进行调用时都被称作构造调用。

　　　　4，js中不存在面向类语言意义上的构造函数，只有基于new操作符号的构造调用。

标签：调用,console,函数,绑定,js,隐形,foo,log
来源： https://www.cnblogs.com/keliguicang/p/10961088.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

js函数—隐形参数this

前言

this的定义

this的绑定规则

new绑定