彻底理解了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='+' ...
随机推荐
- Flask入门HelloWorld
Flask入门HelloWorld Flask官网:http://flask.pocoo.org/ Flask中文翻译:http://dormousehole.readthedocs.io/en/la ...
- LinkedList源码解析(JDK1.8)
package java.util; import java.util.function.Consumer; /** * LinkedList是List和Deque接口的双向链表的实现.实现了所有可选 ...
- C语言第九次博客作业--指针
一.PTA实验作业 题目1:两个4位正整数的后两位互换 1. 本题PTA提交列表 2. 设计思路 定义循环变量i,两个数组a[4],b[4] for i=0 to 3 a[i]*p取各个位 *p/=1 ...
- C语言第八次博客作业--字符数组
一.PTA实验作业 题目1:查验身份证 1. 本题PTA提交列表 2. 设计思路 定义i,flag=1,z,m[11],a[19] 输入次数n for i=1 to n+1 gets(a) 加权求和在 ...
- eclipse的Debug模式下的快捷键
主要快捷键: F5, F6, F7, F8的使用 F5: 进入当前方法 F6: 一步步执行 F7: 跳出方法, 返回到调用此方法的最后一条语句 F8: 继续执行,跳转到下一个断点的位置 示例: 在 ...
- javascript中的null,对象系统还是非对象系统?
1.一直以来的认知 在我学习js的过程中,爱民老师的绿皮书里将js的类型系统分成了两类: 其一是元类型系统:由typeof运算来检测 其二是对象类型系统:是元类型的object的一个分支 而null这 ...
- 使用了旧版nuget的.net项目在git中的问题
曾几何时,使用nuget包管理项目依赖还需要将nuget执行程序及其配置文件包含在项目中. 如上图所示,在解决方案文件夹中,有专门为nuget程序设置的 .nuget 子目录. 当将项目纳入git管理 ...
- GDB 调试多线程多进程
GDB是linux下的调试利器,在c/c++程序开发过程中必不可少的.这里总结一下多进程和多线程的调试方法和技巧. 多进程的调试: 如下示例 #include <sys/mman.h> # ...
- 漫谈Java IO之普通IO流与BIO服务器
今天来复习一下基础IO,也就是最普通的IO. 网络IO的基本知识与概念 普通IO以及BIO服务器 NIO的使用与服务器Hello world Netty的使用与服务器Hello world 输入流与输 ...
- 第二次作业之微信小程序
2.1 介绍产品相关信息 你选择的产品是? 微信小程序 为什么选择该产品作为分析? 在等待了1年多以后,小程序终于在今年初上线,即速应用在H5领域的累计,便承接在小程序上.8月7日,即速应用的用户微信 ...