JS中的bind方法
# bind的机制
```
var foo = function(){}
var bar = foo;
console.log(foo === bar) //true
/--------------------------------------/
var foo = function(){}
var bar = function(callback1,callback2){
console.log(callback1 === callback2) //true
}
bar(foo,foo)
/--------------------------------------/
var foo = function(){}
var bar = function(){}
console.log(foo === bar) //false //两个函数,不在同一内存地址中,所以返回了false
对象有属性和方法,函数也是对象的一种,我们也可以称之为函数对象,既然是对象那么就有熟悉和方法,bind就是函数对象下面的一个方法。
我们都知道对象是引用类型,引用的是内存中的一个地址,上面的callback1 === callback2这两个指针就指向了一个地址所以为true。
<br>
<br>
var foo = function(){}
var fooBind = foo.bind()
console.log(foo === fooBind) // false
/--------------------------------------/
var foo = function(){}
var fooBind = foo.bind()
var bar = function(callback1,callback2){
console.log(callback1 === callback2) //false
}
bar(foo,fooBind)
上面的代码中的 foo.bind()的返回值是一个新的函数,其实是将foo拷贝了一份,他们两个已经没有了任何关系,也就是说foo和fooBind已经不在同一个内存地址中了,所以返回了false。
<br>
<br>
var foo = function(){}
var fooBind1 = foo.bind()
var fooBind2 = foo.bind()
console.log(fooBind1 === fooBind2) //false
虽然上面的fooBind1和fooBind2都使用了foo.bind()进行了拷贝,但他们也并没有任何关系,完全两个独立的函数。
<br>
<br>
var obj = {key:"value"}
var foo = function(){
return this;
}
var fooBind1 = foo.bind(obj)
var fooBind2 = foo.bind(obj)
console.log( fooBind1() === fooBind2 () ) //true 他们都指向了同一个obj
console.log( fooBind1 === fooBind2 ) //false 他们分别是存在两个不同内存地址中的,与函数中的this无关,所以返回了false
有人就会这么想了,bind方法的主要目的是为了改变函数内的this指向,那如果我用bind方法拷贝了一个fooBind1和一个fooBind2让他们中的this都指向obj这个对象,那这fooBind1和fooBind2还在同一内存地址中吗
<br>
<br>
<br>
<br>
# bind的用法
var obj = {key:"value"}
var foo = function(){
console.log(this) //obj
}.bind(obj)
foo()
/--------------------------------------/
var obj = {key:"value"}
var foo = function(){
console.log(this) //obj
}
foo.bind(obj)() //也可以这样
让foo中的this指向obj。注意:foo已经并不是foo本身了,而是调用了bind之后返回的一个新的函数
<br>
<br>
var obj = {
method:function(){
setTimeout(function(){
console.log(this) //obj 注意:function(){console.log(this)}.bind(this) 返回值是一个函数
}.bind(this),1000)
}
}
obj.method()
/--------------------------------------/
var obj = {
method:function(){
var arg = function(){
console.log(this) //obj
}
var argBind = arg.bind(this) //返回来的argBind函数与arg函数完全没有任何关系。
setTimeout(argBind,1000) //与上面的写法完全相等
}
}
obj.method()
简单的使用
JS中的bind方法的更多相关文章
- JS中的bind方法学习
EcmaScript5给Function扩展了一个方法:bind 众所周知 在jQuery和prototype.js之类的框架里都有个bind jQuery里的用途是给元素绑定事件 $("# ...
- 分享一个js中的bind方法使用
来源:http://www.cnblogs.com/yuzhongwusan/archive/2012/02/13/2348782.html Js代码 复制代码 代码如下: var first_obj ...
- js中的bind方法的实现方法
js中目前我遇见的改变作用域的5中方法:call, apply, eval, with, bind. var obj = { color: 'green' } function demo () { c ...
- 秒味课堂Angular js笔记------Angular js中的工具方法
Angular js中的工具方法 angular.isArray angular.isDate angular.isDefined angular.isUndefined angular.isFunc ...
- js中的tostring()方法
http://blog.sina.com.cn/s/blog_85c1dc100101bxgg.html js中的tostring()方法 (2013-11-12 11:07:43) 转载▼ 标签: ...
- JS中通过call方法实现继承
原文:JS中通过call方法实现继承 讲解都写在注释里面了,有不对的地方请拍砖,谢谢! <html xmlns="http://www.w3.org/1999/xhtml"& ...
- jQuery与JS中的map()方法使用
1.jquery中的map()方法 首先看一个简单的实例: $("p").append( $("input").map(function(){ return $ ...
- JavaScript -- 时光流逝(二):js中数组的方法
JavaScript -- 知识点回顾篇(二):js中数组的方法 1. 数组 (1)定义数组,数组赋值 <script type="text/javascript"> ...
- ASP.NET#使用母版时,如果要使用js中的getElementById()方法取得某个内容页的元素时要注意的问题
当使用母版,要使用js中的getElementById()方法取得某个内容页的元素时,所选取的id并不是母版中内容页的id,而是在设计内容页时设定的id例子:母版页: ...... <head ...
随机推荐
- 初入React源码(一)
导语 React是我接触的第二个框架,我最初开始接触的是vue,但是并没有深入的理解过vue,然后在工作过程中,我开始使用了React,现在已经觉得React会比vue更加实用,但是这只是个人观点,可 ...
- 怎样实现App安装来源追踪
众所周知,国内的应用商店存在一定的限制,开发者很难有效监测到App安装来源的精准数据.但在实际推广中,广告效果.用户行为.付费统计.邀请关系等不同渠道的指标却是衡量渠道价值的关键,对App的运营推广和 ...
- 短视频sdk:选择一个靠谱的短视频SDK 你需要了解这些
2017 年,短视频成为了内容创业的新风口,各种短视频 App 如雨后春笋般先后上线.随着互联网内容消费升级,视频越来越像文字.图片一样,成为每一个 App 不可或缺的一部分. 为了能够更好地聚焦于业 ...
- [Docker]compose一键部署nginx
Docker-compose部署nginx 创建配置文件 mkdir -p /usr/local/docker/nginx cat > /usr/local/docker/nginx/docke ...
- 题解 CF1286A 【Garland】
updata on 2020.3.19 往博客园搬的时候看了看自己以前写的blog 其实没多久,才两个多月,感觉自己之前写的东西好罗嗦啊.. 但也是最近写的blog才开始多起来 当然现在也没好到哪去. ...
- 分治思想--快速排序解决TopK问题
----前言 最近一直研究算法,上个星期刷leetcode遇到从两个数组中找TopK问题,因此写下此篇,在一个数组中如何利用快速排序解决TopK问题. 先理清一个逻辑解决TopK问题→快速排序→递 ...
- Halloween Costumes 玄学题
传送门 太难了,完全不懂 设\(dp[i][j]\)为第i天到第j天的最少代价 \(dp[i][j]=dp[i][j-1]+1\)(第j天多穿一件衣服) \(dp[i][j]=min(dp[i][j] ...
- LTE基站开局流程脚本的具体含义
1.全局参数配置MOD ENODEB(修改基站): ENODEBID=2015(基站标识2015), NAME="安职-1"(基站名称), ENBTYPE=DBS3900_LTE( ...
- 【Spark】SparkStreaming和Kafka的整合
文章目录 Streaming和Kafka整合 概述 使用0.8版本下Receiver DStream接收数据进行消费 步骤 一.启动Kafka集群 二.创建maven工程,导入jar包 三.创建一个k ...
- 【Spark】通过Spark实现点击流日志分析
文章目录 数据大致内容及格式 统计PV(PageViews) 统计UV(Unique Visitor) 求取TopN 数据大致内容及格式 194.237.142.21 - - [18/Sep/2013 ...