A-A+

javascript中的call、apply与bind

2016年12月26日 默认文章 暂无评论

apply的第二个参数可以为数组或类数组,apply将这个集合中的元素作为参数传递给被调用的函数。(带下标的集合)。使用率比较高。

  1. var func = function( a, b, c ){
  2. alert ( [ a, b, c ] ); // 输出 [ 1, 2, 3 ]
  3. };
  4. func.apply( null, [ 1, 2, 3 ] );
传入参数的形式不同,call则传入的参数不固定
  1. var func = function( a, b, c ){
  2. alert ( [ a, b, c ] ); // 输出 [ 1, 2, 3 ]
  3. };
  4. func.call( null, 1, 2, 3 );
上面两个方法,如果传入参数的时候,第一参数为null,则this会指向默认的宿主对象。严格模式下,函数体内的this还是null。
有时候使用他们的意图并不在于改变this的指向,可以借用其他对象的方法。
  1. Math.max.apply( null, [ 1, 2, 5, 3, 4 ] ) // 输出:5
  1. document.getElementById( 'div1' ).onclick = function(){
  2. alert( this.id ); // 输出:div1
  3. var func = function(){
  4. alert ( this.id ); // 输出:undefined
  5. }
  6. func();
  7. };
  1. document.getElementById( 'div1' ).onclick = function(){
  2. var func = function(){
  3. alert ( this.id ); // 输出:div1
  4. }
  5. func.call( this ); //修正func内的this
  6. };
bind函数
  1. Function.prototype.bind = function( context ){
  2. var self = this; // 保存原函数
  3. return function(){ // 返回一个新的函数
  4. return self.apply( context, arguments );
  5. // 执行新的函数的时候,会把之前传入的 context 当作新函数体内的 this
  6. }
  7. };
  1. Function.prototype.bind = function(){
  2. var self = this, // 保存原函数
  3. context = [].shift.call( arguments ),
  4. // 需要绑定的 this 上下文
  5. args = [].slice.call( arguments );
  6. // 剩余的参数转成数组
  7. return function(){ // 返回一个新的函数
  8. return self.apply( context, [].concat.call( args, [].slice.call( arguments ) ) );
  9. // 执行新的函数的时候,会把之前传入的 context 当作新函数体内的 this
  10. // 并且组合两次分别传入的参数,作为新函数的参数
  11. }
  12. };
借用其他对象的方法
    
  1. var A = function( name ){
  2. this.name = name;
  3. };
  4. var B = function(){
  5. A.apply( this, arguments );
  6. };
  7. B.prototype.getName = function(){
  8. return this.name;
  9. };
  10. var b = new B( 'sven' );
  11. console.log( b.getName() ); // 输出: 'sven'
  1. (function(){
  2. Array.prototype.push.call( arguments, 3 );
  3. console.log ( arguments ); // 输出[1,2,3]
  4. })( 1, 2 );
  1. var a = {};
  2. Array.prototype.push.call( a, 'first' );
  3. alert ( a.length ); // 输出:1
  4. alert ( a[ 0 ] ); // first
 对象本身要可以存取属性;对象的 length 属性可读写。

标签:

给我留言

Copyright © 花未全开月未圆 保留所有权利.   Theme  Ality 海外

用户登录