彻底理解了call()方法,apply()方法和bind()方法
javascript中的每一个作用域中都有一个this对象,它代表的是调用函数的对象。在全局作用域中,this代表的是全局对象(在web浏览器中指的是window)。如果包含this的函数是一个对象的方法,this指向的就是这个对象。因此在上面例子中就不用直接写对象的名字,而是使用this代替它,例如:
var human = {
name: '霍林林',
sayName: function(){
console.log(this.name);
}
}
human.sayName();
下面这个例子中,我们直接使用person.name,这种做法会增加方法与对象之间的耦合度(它们之间的依赖性变强了)。这样写是有问题的 ,如果我们的变量名修改了,我们必须同时修改方法中的变量名。幸运的是,JavaScript给我们提供了解决这个问题的方法。
var person = {
name: '霍林林',
sayName: function(){
console.log(person.name);
}
}
person.sayName();
1.改变this
this通常是被自动赋值的,但是我们可以改变this的指向。JavaScript给我们提供了 3 中 函数方法 来改变this的指向。
2.call()方法
这个方法的第一个参数表示this指向的对象,后面的所有参数都是函数的参数。例如:
function sayName(label) {
console.log(label+'--->'+this.name);
}
var name = '张三';
var person1 = {
name: '李四'
};
var person2 = {
name: '王二'
};
sayName.call(window,'global'); //'global--->张三'
sayName.call(person1,'person1'); //'person1--->李四'
sayName.call(person2,'person2'); //'person2--->王二'
3.apply()方法
這個方法和call方法的作用都是相同的,只不过在传递参数时候,call方法可以传递多个参数,而apply方法只能传递一个方法,并且要求是一个数组。
function sayName(label) {
console.log(label);
console.log(this.name);
}
var name = '张三';
var person1 = {
name: '李四'
};
var person2 = {
name: '王二'
};
sayName.apply(window,['global']); //'global--->张三'
sayName.apply(person1,['person1']); //'person1--->李四'
sayName.apply(person2,['person2']); //'person2--->王二'
4.bind()方法
bind()方法第一个参数是我们希望函数中this指向的对象,后面的参数是我们希望给函数的参数绑定的值。
var obj = {
name:'小明'
age:23
};
function myName(age,gender){
console.log(this.name,age,gender);
}
var newName = myName.bind(obj);
newName(); //小明 undefined undefined
var newName2 = myName.bind(obj,18);
newName2(); //小明 18 undefined
var newName3 = myName.bind(obj,18,'女');
newName3(); //小明 18 女
var newName4 = myName.bind(obj);
newName4(18,'女'); //小明 18 女
彻底理解了call()方法,apply()方法和bind()方法的更多相关文章
- JavaScript中的apply()方法和call()方法使用介绍
1.每个函数都包含两个非继承而来的方法:apply()和call(). 2.他们的用途相同,都是在特定的作用域中调用函数. 3.接收参数方面不同,apply()接收两个参数,一个是函数运行的作用域(t ...
- JS中的call()和apply()方法和bind()
1.方法定义 call方法: 语法:call([thisObj[,arg1[, arg2[, [,.argN]]]]]) 定义:调用一个对象的一个方法,以另一个对象替换当前对象. 说明: call ...
- ASP.NET的Eval方法和Bind方法的区别
Eval是只读的方法(单向数据在邦定),所邦定的内容为不会提交回服务器. 比如图书的ISBN,并不想让用户做任何修改,可以使用<%# Eval('ISBN').TOString().Trim() ...
- JavaScript的apply()方法和call()方法
1 <script type="text/javascript"> 2 /*定义一个人类*/ 3 function Person(name,age) 4 { 5 thi ...
- apply方法和call方法的详解2
1.apply和call的区别在哪里 2.什么情况下用apply,什么情况下用call 3.apply的其他巧妙用法(一般在什么情况下可以使用apply) 我首先从网上查到关于apply和call的定 ...
- apply方法和call方法。函数属性与方法。
每个函数都有length属性哥prototype属性. length属性表示的是函数接入参数的个数 在es引用类型语言中,prototype是保存它们所有实例方法的真正所在.换句话来说,类似于toSt ...
- AngularJs $scope 里面的$apply 方法和$watch方法
Angular $scope 里面的$apply 方法 Scope提供$apply方法传播Model变化 <!DOCTYPE html> <html> <head> ...
- apply()方法和call()方法
obj.func.call(obj1) //是将obj1看做obj,调用func方法,将第一个参数看做函数调用的对象,可以看做,将obj的方法给obj1使用 ECMAScript规范给所有 ...
- 记录一个python公式罗列的方法 join()方法和map()方法的妙用
题干: 怎样将一个列表中的元素读出,并列出计算式子 比如:[,,,] 输出:+++ = 列表中的元素个数不定 小白和大神的方法: #小白的 numlist=[,,,] sum1='' cal='+' ...
随机推荐
- Python sort后赋值 操作陷阱
x=[1,4,2,0] # 错误的方式,因为sort没有返回值 y=x.sort() type (y) #NoneType #正确的方式 x.sort() y=x[:]
- [模拟赛] T3 Exploit
Description 4X概念体系,是指在PC战略游戏中一种相当普及和成熟的系统概念,得名自4个同样以"EX"为开头的英语单词. eXplore(探索) eXpand(拓张与发展 ...
- 使用python和pygame绘制繁花曲线
前段时间看了一期<最强大脑>,里面展示了各种繁花曲线组合成的非常美丽的图形,一时心血来潮,想尝试自己用代码绘制繁花曲线,想怎么组合就怎么组合. 真实的繁花曲线使用一种称为繁花曲线规的小玩意 ...
- 1. 初识 Lucene
在学习Lucene之前呢,我们当然首先要了解下什么是Lucene. 0x01 什么是Lucene ? Lucene是一套用于全文检索和搜索的开放源代码程序库,由Apache软件基金会支持和提供. Lu ...
- 如何使用maven搭建web项目
博客园注册了有二十多天了,还没有写过博客,今天就发一篇,也便于后面查找笔记. 我个人已经做了几年的java web开发了,由于所在的公司是业务型公司,用的都是一些老旧的稳定技术,很少接触到稍微新点的内 ...
- pjax实例demo(c#,iis)
pjax 百度都是api 也没找到demo 自己写了一个 C#写的 需要iis架设 测试ie10 和 火狐 成功 ie10不要用兼容模式 不然不好使 iis 可以直接架设webDemo1文件夹(源码) ...
- 冲刺NO.11
Alpha冲刺第十一天 站立式会议 项目进展 项目进入尾声,主要测设工作完成过半,项目总结也开始进行. 问题困难 项目的困难现阶段主要是测试过程中存在一些"盲点"很难发现或者发现后 ...
- 201621123057 《Java程序设计》第12周学习总结
1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结多流与文件相关内容. 2. 面向系统综合设计-图书馆管理系统或购物车 使用流与文件改造你的图书馆管理系统或购物车. 2.1 简述如何 ...
- Java中的Integer
包装类---Integer Integer 类在对象中包装了一个基本类型int的值.Integer类型的对象包含一个 int 类型的字段.此外,该类提供了多个方法,能在 int 类型和 String ...
- Linux系统安装gcc/g++详细过程
下载: http://ftp.gnu.org/gnu/gcc/gcc-4.5.1/gcc-4.5.1.tar.bz2 浏览: http://ftp.gnu.org/gnu/gcc/gcc-4.5.1/ ...