提到bind方法,估计大家还会想到call方法、apply方法;它们都是Function对象内建的方法,它们的第一个参数都是用来更改调用方法中this的指向。需要注意的是bind 是返回新的函数,以便稍后调用;apply 、call 则是立即调用原函数 。而今天我们主要讲解bind方法的理解与使用。

bind方法是EcmaScript5新增的方法,该方法在mdn上是这么介绍的:

  bind()方法创建一个新的函数(称为绑定函数), 当被调用时,将其this关键字设置为提供的值,在调用新函数时,在任何提供之前提供一个给定的参数序列。

语法:

fun.bind(thisArg[, arg1[, arg2[, ...]]])

  参数thisArg表示:当绑定函数被调用时,该参数会作为this的指向。当使用new操作符调用绑定函数时,该参数无效。

  参数arg1, arg2, ...表示:当绑定函数被调用时,这些参数将置于实参之前传递给被绑定的方法。

先来看个例子:

this.name="jack";
var demo={
name:"rose",
getName:function(){return this.name;}
} console.log(demo.getName());//输出rose 这里的this指向demo var another=demo.getName;
console.log(another())//输出jack 这里的this指向全局对象 //运用bind方法更改this指向
var another2=another.bind(demo);
console.log(another2());//输出rose 这里this指向了demo对象了

bind的应用

可以对一个函数预设初始参数:

function a(){
return Array.prototype.slice.call(arguments);//将类数组转换成真正的数组
}
var b=a.bind(this,15,20)
alert(b());//弹出 15,20
var s=b(25,30);
alert(s);//弹出 15,20,25,30

理解js中bind方法的使用的更多相关文章

  1. 【转载】JS中bind方法与函数柯里化

    原生bind方法 不同于jQuery中的bind方法只是简单的绑定事件函数,原生js中bind()方法略复杂,该方法上在ES5中被引入,大概就是IE9+等现代浏览器都支持了(有关ES5各项特性的支持情 ...

  2. 怎么理解js中的事件委托

    怎么理解js中的事件委托 时间 2015-01-15 00:59:59  SegmentFault 原文  http://segmentfault.com/blog/sunchengli/119000 ...

  3. js中bind解析

    一.arguments的含义 // arguments 是一个对应于传递给函数的参数的类数组对象 function a(){ console.log(arguments); } a(); // Arg ...

  4. 图文结合深入理解 JS 中的 this 值

    图文结合深入理解 JS 中的 this 值 在 JS 中最常见的莫过于函数了,在函数(方法)中 this 的出现频率特别高,那么 this 到底是什么呢,今天就和大家一起学习总结一下 JS 中的 th ...

  5. 如何理解js中的this和实际应用中需要避开哪些坑

    this是什么 this就是函数内部的关键字 看下面例子理解js中的this // 例子1 function fnOne () { console.log(this) } 'use strict' f ...

  6. 深入理解Js中的this

    深入理解Js中的this JavaScript作用域为静态作用域static scope,但是在Js中的this却是一个例外,this的指向问题就类似于动态作用域,其并不关心函数和作用域是如何声明以及 ...

  7. 如何更好的理解js中的this,分享2段有意思的代码

    关于js中this的浅析,大家可以点击[彻底理解js中this的指向,不必硬背]这篇博客了解. 今天遇到2段比较有意思的代码. ----------------第一段----------------- ...

  8. 关于JS中的方法是否加括号的问题

    js中的方法什么时候加括号什么时候不加括号呢,我们有时候经常就搞不清楚,记住下面这几点就好理解了. 1.函数做参数时都不要加括号. function fun(a){ alert(a); } funct ...

  9. 深入理解JS中的对象(二):new 的工作原理

    目录 序言 不同返回值的构造函数 深入 new 调用函数原理 总结 参考 1.序言 在 深入理解JS中的对象(一):原型.原型链和构造函数 中,我们分析了JS中是否一切皆对象以及对象的原型.原型链和构 ...

随机推荐

  1. 使用Chrome-headless模式下,截屏不全屏的问题

    在headless模式下,是没有打开浏览器窗口的,那么driver.maximize_window(),找不到目标也打不开. 我们可以换一种方式,去在无头模式下,指定浏览器的窗口大小运行即可. __o ...

  2. Unity3D实现随机播放背景音频

    1.先在第一人称下新建空白物体,命名“audio” 2.在audio中加入Audio Source 3.在第一人称组件里添加Audio Liistener和Audio脚本 4.脚本中添加代码 usin ...

  3. (转)Linux下同步工具inotify+rsync使用详解

    原文:https://segmentfault.com/a/1190000002427568 1. rsync 1.1 什么是rsync rsync是一个远程数据同步工具,可通过LAN/WAN快速同步 ...

  4. java调用svnkit工具类上传本地文件到svn服务器

    package org.jenkinsci.plugins.svn.upload.step; import java.io.*; import org.tmatesoft.svn.core.SVNCo ...

  5. mongo 与 传统mysql语法对比

    MongoDB语法                                  MySql语法 db.test.find({'name':'foobar'})<==> select ...

  6. 16.Generator函数的语法

    1.简介 Generator 函数是 ES6 提供的一种异步编程解决方案,语法行为与传统函数完全不同. 执行 Generator 函数会返回一个遍历器对象,也就是说,Generator 函数除了状态机 ...

  7. Android开源项目xUtils HttpUtils模块分析(转)

    xUtils是github上的一个Android开源工具项目,其中HttpUtils模块是处理网络连接部分,刚好最近想整理下Android网络编程知识,今天学习下xUtils中HttpUtils. x ...

  8. elixir二进制模式匹配

    for << << b1::size(2), b2::size(3), b3::size(3) >> <- "hello" >> ...

  9. HTTP访问的两种方式:HttpURLConnection和HTTPClient的比较

    http://blog.sina.com.cn/s/blog_87216a0001014sm7.html http://www.2cto.com/kf/201305/208770.html ----- ...

  10. PHP之string之explode()函数使用

    explode (PHP 4, PHP 5, PHP 7) explode - Split a string by string explode - 使用一个字符串分割另一个字符串 Descripti ...