JavaScript函数(二)——函数属性及this

函数属性

arguments

function foo(x, y, z){
    arguments.length;//2,实参个数
    arguments[0];//
    arguments[0] = 10;
    x;//change to 10;绑定关系
    
    arguments[2] = 100;
    z;//still undefined!,调用时未传参数,失去绑定关系
    arguments.callee === foo//true
}

foo(1,2);
foo.length;//3,形参个数
foo.name;//'foo'

严格模式下,对arguments[0]或x赋值,彼此不影响,只改变自身,并且禁止使用arguments.callee。

this

  1. 当函数作为对象的方法调用时,this指向该对象。

  2. 当函数作为淡出函数调用时,this指向全局对象(严格模式时,为undefined)

  3. 构造函数中的this指向新创建的对象

  4. 嵌套函数中的this不会继承上层函数的this,如果需要,可以用一个变量保存上层函数的this

  5. 如果一个函数中有this,这个函数中包含多个对象,尽管这个函数是被最外层的
    对象所调用,this指向的也只是它上一级的对象

举例:setInterval等window方法的this,指向就是window,因其被window调用

this的指向在函数创建的时候是决定不了的,在调用的时候才能决定
this永远指向的是最后调用它的对象,也就是看它执行的时候是谁调用的

call/apply方法与this

改变函数的this的指向

apply与call只是传参的形式有区别。

apply 方法传入两个参数:一个是作为函数上下文的对象,另外一个是作为函数参数所组成的数组。

call 方法第一个参数也是作为函数上下文的对象,但是后面传入的是一个参数列表,而不是单个数组。

对于什么时候该用什么方法,其实不用纠结。如果你的参数本来就存在一个数组中,那自然就用 apply,如果参数比较散乱相互之间没什么关联,就用 call

apply 和 call 的用法

1. 改变 this 指向
var obj = {
    name: 'yan'
}

function func() {
    console.log(this.name);
}

func.call(obj);       // yan

我们知道,call 方法的第一个参数是作为函数上下文的对象,这里把 obj 作为参数传给了 func,此时函数里的 this 便指向了 obj 对象。此处 func 函数里其实相当于

function func() {
    console.log(obj.name);
}
2. 借用别的对象的方法
var Person1  = function () {
    this.name = 'yan;
}
var Person2 = function () {
    this.getname = function () {
        console.log(this.name);
    }
    Person1.call(this);//调用Person1的构造函数
}
var person = new Person2();
person.getname();       // yan

从上面我们看到,Person2 实例化出来的对象 person 通过 getname 方法拿到了 Person1 中的 name。因为在 Person2 中,Person1.call(this) 的作用就是使用 Person1 对象代替 this 对象,那么 Person2 就有了 Person1 中的所有属性和方法了,相当于 Person2 继承了 Person1 的属性和方法。

3. 调用函数

apply、call 方法都会使函数立即执行,因此它们也可以用来调用函数。

function func() {
    console.log('yan');
}
func.call();//yan

bind方法与this

它和 call 很相似,接受的参数有两部分,第一个参数是是作为函数上下文的对象,第二部分参数是个列表,可以接受多个参数。

call 和 bind 的区别

1. bind 返回值是函数
var obj = {
    name: 'yan'
}

function func() {
    console.log(this.name);
}

var func1 = func.bind(obj);
func1();// yan
2. 参数的使用
function func(a, b, c) {
    console.log(a, b, c);
}
var func1 = func.bind(null,'yan');

func('A', 'B', 'C');// A B C
func1('A', 'B', 'C');// yan A B
func1('B', 'C');// yan B C
func.call(null, 'linxin');// yan undefined undefined

call 是把第二个及以后的参数作为 func 方法的实参传进去,而 func1 方法的实参实则是在 bind 中参数的基础上再往后排。

猜你喜欢

转载自www.cnblogs.com/y-dt/p/9382262.html