文档章节

JS中的call()和apply()方法

 青衫旧巷
发布于 2017/08/25 10:40
字数 925
阅读 24
收藏 0

call方法:

语法:call([thisObj[,arg1[, arg2[, [,.argN]]]]]) ;

定义:调用一个对象的一个方法,以另一个对象替换当前对象。

说明:

call 方法可以用来代替另一个对象调用一个方法。

call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。 如果没有提供 thisObj 参数,那么 Global 对象被用作 thisObj。

var aa = Array.prototype.slice.call('abcdefg',',');
console.log(aa);

//join(index);  从index开始剪切数组里面的元素
//字符串没有join()方法,所以call()就是让字符串借用数组的这个join()方法
//"a,b,c,d,e,f,g"


function add(a,b)  
{  
    console.log(a+b);  
}  
function sub(a,b)  
{  
    console.log(a-b);  
}  
  
add.call(sub,3,1);  

//结果:4

//这个例子中的意思就是用 add 来替换 sub,add.call(sub,3,1) == add(3,1) ,所以运行结果为:alert(4); // 注意:js 中的函数其实是对象,函数名是对 Function 对象的引用。

apply方法:

语法:Function.apply(obj,args)方法能接收两个参数:

obj:这个对象将代替Function类里this对象

args:这个是数组或类数组,apply方法把这个集合中的元素作为参数传递给被调用的函数。

定义:应用某一对象的一个方法,用另一个对象替换当前对象。

call方法与apply方法的第一个参数是一样的,只不过第二个参数是一个参数列表

说明:

如果 argArray 不是一个有效的数组或者不是 arguments 对象,那么将导致一个 TypeError。

如果没有提供 argArray 和 thisObj 任何一个参数,那么 Global 对象将被用作 thisObj, 并且无法被传递任何参数。

var aa = Array.prototype.join.apply('abcdefg',[',']);
console.log(aa);
//"a,b,c,d,e,f,g"


function Animal(){    
    this.name = "Animal";    
    this.showName = function(){    
        alert(this.name);    
    }    
}    
  
function Cat(){    
    this.name = "Cat";    
}    
   
var animal = new Animal();    
var cat = new Cat();    
    
//通过call或apply方法,将原本属于Animal对象的showName()方法交给对象cat来使用了。

//animal.showName.call(cat,",");    
animal.showName.apply(cat,[]);

//输入结果为"Cat"
// call 的意思是把 animal 的方法放到cat上执行,原来cat是没有showName() 方法,现在是把animal 的showName()方法放到 cat上来执行,所以this.name 应该是 Cat

实现继承

function Animal(name){      
    this.name = name;      
    this.showName = function(){      
        alert(this.name);      
    }      
}      
    
function Cat(name){    
    Animal.call(this, name);    
}      
    
var cat = new Cat("Black Cat");     
cat.showName();  

//输入结果为"Black Cat"    
//Animal.call(this) 的意思就是使用 Animal对象代替this对象,那么 Cat中不就有Animal的所有属性和方法了吗,Cat对象就能够直接调用Animal的方法以及属性了.

apply和call的区别:

这两个方法基本上是一个意思,调用一个对象的一个方法,以另一个对象替换当前对象。 换句话说,就是为了改变函数体内部 this 的指向。

区别在于 call 的第二个参数可以是任意类型,而apply的第二个参数必须是数组,也可以是arguments

在非严格模式下当我们第一个参数传递为null或undefined时,函数体内的this会指向默认的宿主对象,在浏览器中则是window

var test = function(){
  console.log(this===window);
}
test.apply(null);//true
test.call(undefined);//true

什么是类数组

类数组

这里把符合以下条件的对象称为类数组

1.具有length属性

2.按索引方式存储数据

3.不具有数组的push,pop等方法

常见类数组有 arguments,NodeList!

(function(){
  Array.prototype.push.call(arguments,4);
  console.log(arguments);//[1, 2, 3, 4]
})(1,2,3)

这样就往arguments中push一个4进去了

© 著作权归作者所有

粉丝 1
博文 61
码字总数 35826
作品 0
东城
私信 提问

暂无文章

RxJava进行单元测试的方式

@Test public void completeTask_retrievedTaskIsComplete() { // Given a new task in the persistent repository final Task newTask = new Task(TITLE, ""); ......

SuShine
44分钟前
5
0
正则表达式大全

检验手机号码 # 要求:手机号码必须为11位数字,以1开头,第二位为1或5或8。import redef verify_mobile(): mob = input("请输入手机号码:") ret = re.match(r"1[358]\d{9}", m......

彩色泡泡糖
47分钟前
7
0
QT之border-image属性

一、border-image的兼容性 border-image可以说是CSS3中的一员大将,将来一定会大放光彩,其应用潜力真的是非常的惊人。可惜目前支持的浏览器有限,仅Firefox3.5,chrome浏览器,Safari3+支持...

shzwork
48分钟前
6
0
Kubernetes Operator简易教程

1. 安装operator-sdk //安装 operator-sdk$ apt-get install operator-sdk.....$ operator-sdk versionoperator-sdk version: v0.7.0$ go versiongo version go1.11.4 darwin/amd64 2......

Robotcl_Blog
48分钟前
5
0
再谈DAG任务分解和Shuffle RDD

1、DagScheduler分析 DagScheduler功能主要是负责RDD的各个stage的分解和任务提交。Stage分解是从触发任务调度过程的finalStage开始倒推寻找父stage,如果父stage没有提交任务则循环提交缺失...

守望者之父
54分钟前
4
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部