javascript如何使用bind指定接收者

代码如下:

var json = {
jArray: [],
jPush: function (c) {
this.jArray.push(c);
}
}
var examp = ["123", "~", "456"];

使用ES5给出的forEach循环examp,并且将它们添加到json中的jArray中;


代码如下:

examp.forEach(json.jPush);

这个时候会报错:

产生这种报错的原因是json.jPush方法中的this并没有指向json对象,而是指向了window.解决这个问题的方法就是给这个this找对人家.
好在forEach()提供了一个参数,专门用于指定对象的.看代码.


代码如下:

examp.forEach(json.jPush,json);
alert(json.jArray);//结果正常了是,123~456

还有另外一种方法:


代码如下:

examp.forEach(function (c) {
json.jPush(c);
});
alert(json.jArray);//123~456

还可以使用bind绑定


代码如下:

examp.forEach(json.jPush.bind(json));
alert(json.jArray);

bind是创建了一个新函数而不是修改一个函数.新函数的行为和原来函数的行为一样,但他的接收者是我们给定的对象,而原有函数的接收者保持不变.
这意味着bind方法的使用是非常安全的,因为一个函数或方法被共享的时候,不用担心这个共享方法不会被修改掉了.

赞 (0)

相关推荐

  • javascript bind绑定函数代码

    具体结论可参见<javascript下动态this与动态绑定实例代码>.本文专注设计一个无侵入的绑定函数. window.name = "the window object" function scopeTest() { return this.name } // calling the function in global scope: scopeTest() // -> "the window object" var foo = { name:

  • javascript中bind函数的作用实例介绍

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <style> button {background-color:#0f0;} </style> </head> <body> <button id="button"> 按钮 </button> <input type="tex

  • 在JavaScript中正确引用bind方法的应用

    在JavaScript中,方法往往涉及到上下文,也就是this,因此往往不能直接引用,就拿最常见的console.log("info-")来说,避免书写冗长的console,直接用log("info-")代替,不假思索的会想到如下语法: var log = console.log; log("info-"); 很遗憾,运行报错:TypeError: Illegal invocation. 为啥呢?对于console.log("info-

  • javascript之bind使用介绍

    前几天看到一个面试题,题目是这样的: 请你说说对javascript中apply,call,bind的理解? 首先apply和call是老生常谈的东西,但是对于bind,我愣了下,因为这个词是jquery中使用频率很高的一个方法,用来给DOM元素绑定事件用的. 为了搞清这个陌生又熟悉的bind,google一下,发现javascript1.8.5版本中原生实现了此方法,目前IE9+,ff4+,chrome7+支持此方法,opera和safari不支持(MDN上的说明). bind的作用和appl

  • javascript中的Function.prototye.bind

    函数绑定(Function binding)很有可能是你在开始使用JavaScript时最少关注的一点,但是当你意识到你需要一个解决方案来解决如何在另一个函数中保持this上下文的时候,你真正需要的其实就是 Function.prototype.bind(),只是你有可能仍然没有意识到这点. 第一次遇到这个问题的时候,你可能倾向于将this设置到一个变量上,这样你可以在改变了上下文之后继续引用到它.很多人选择使用 self, _this 或者 context 作为变量名称(也有人使用 that)

  • 浅谈javascript中call()、apply()、bind()的用法

    call(thisObj,arg1,arg2...).apply(thisObj,[obj1,obj2...])这二个方法是每个函数都包含的非继承的方法 call(thisobj[, args])和apply(thisobj[, args]) 作用都是一样的,简单来说就是改变当前使用该方法的对象中的this指向,指向调用方法中的thisObj对象二者的区别(第一个参数是相同的)就是call方法中传入的参数是是一个个列举出来的,而apply方法中的参数二是一个数组 还是举例说明比较直观: wind

  • JavaScript中的prototype.bind()方法介绍

    以前,你可能会直接设置self=this或者that=this等等,这样做当然也能起作用,但是使用Function.prototype.bind()会更好,看上去也更专业.下面举个简单的例子: 复制代码 代码如下: var myObj = {    specialFunction: function () {    },    anotherSpecialFunction: function () {    },    getAsyncData: function (cb) {        c

  • javascript tabIndex属性

    tabIndex 的用处很简单,就是利用tab键遍历页面的表单元素和链接,按照tabindex的大小决定顺序.虽然微不足道,但细节处见真功夫,这是任何一个WEB应用应当具备的亲用力,保证用户在没有鼠标的情况下(如WAP)仍然可以正常使用. 下面的例子,为了突现tabIndex控制焦点跳转的能力,特意把顺序打乱了.请先选中第一个文本域,然后按tab键观察. tabIndex By 司徒正美 window.onload = function(){ var els = document.getElem

  • javascript中call,apply,bind的用法对比分析

    关于call,apply,bind这三个函数的用法,是学习javascript这门语言无法越过的知识点.下边我就来好好总结一下它们三者各自的用法,及常见的应用场景. 首先看call这个函数,可以理解成"借用","请求".想像一下如下的情景:你孤单一人漂泊在外,有急事想往家里打电话,可是很不巧,手机欠费了,或者没电了,或者掉坑里了,总之你的手机就是用不成.可是你非打这个电话不可,于是你可以去借一下朋友的手机,或者借用一下邻居的手机,或者公用电话,这样呢,你就可以在自己

  • javascript如何使用bind指定接收者

    javascript如何使用bind指定接收者

    复制代码 代码如下: var json = { jArray: [], jPush: function (c) { this.jArray.push(c); } } var examp = ["123", "~", "456"]; 使用ES5给出的forEach循环examp,并且将它们添加到json中的jArray中; 复制代码 代码如下: examp.forEach(json.jPush); 这个时候会报错: 产生这种报错的原因是json.j

  • JavaScript实现数组在指定位置插入若干元素的方法

    本文实例讲述了JavaScript实现数组在指定位置插入若干元素的方法.分享给大家供大家参考.具体如下: 我们可以通过JS数组的splice方法在执行的位置插入新的元素,非常简单 <!DOCTYPE html> <html> <body> <p id="demo"> Click the button to add elements to the array. </p> <button onclick="myFu

  • JavaScript中为事件指定处理程序的五种方式分析

    本文实例讲述了JavaScript中为事件指定处理程序的五种方式.分享给大家供大家参考,具体如下: JavaScript和HTML之间的交互是通过事件实现的. IE9.Firefox.Opera.Sarifi.Chrome都已经实现了DOM2级事件模块的核心部分,IE8是最后一个仍然使用其专有事件系统的主要浏览器. 事件流: 事件流描述的是从页面中接受事件的顺序,但IE和Netscape却提出了完全相反的事件流的概念,IE的事件流是事件冒泡流,而Netscape的事件流是事件捕获流. 1) 事件

  • JavaScript talbe表中指定位置插入一行的实现代码 脚本之家修正版

    JavaScript talbe表中指定位置插入一行的实现代码 脚本之家修正版

    最近在学JavaScript,下面是我自己做的一个例子(在w3cschool例子的基础上) 该例子实现功能是在鼠标点击的行之后插入一行,默认是在第一行插入.插入的内容可以自己输入,代码如下 //global var var pos =0 //to find the position you mouse has pressed function whichElement(e) { var targ if (!e) var e = window.event if (e.target) targ =

  • Javascript Function.prototype.bind详细分析

      Function.prototype.bind分析 bind()方法会创建一个新的函数,成为绑定函数.当调用这个绑定函数时,绑定函数会以创建它时传入的第一个参数作为this,传入bind()方法的第二个以及以后的参数加上绑定函数运行时本身的参数按照顺序作为原函数的参数来调取原函数. 实际使用中我们经常会碰到这样的问题: var name = "pig"; function Person(name){ this.name = name; this.getName = function

  • javascript 获取HTMl文件指定元素的代码

    获取HTML文件的指定元素 function getElement1(){ alert(document.all("myH2").tagName); } function getElement2(){ alert(myH2.tagName); } function showTags(){ alert(document.all.tags("P").length); } function showItems(){ var strTags = "";

  • javascript获取网页中指定节点的父节点、子节点的方法小结

    我们在实际的开发当中经常要获取页面中某个html元素,动态的更新该元素的样式.内容属性等. 那么如何获取要更新的这些元素呢?用JavaScript获取这些节点的方法有很多种,下面是总结的一些方法. 1. 通过document节点获取: (1) document.getElementById(elementId):该方法通过节点的ID,可以准确获得需要的元素,是比较简单快捷的方法.如果页面上含有多个相同id的节点,那么只返回第一个节点. 如 今,已经出现了如prototype.Mootools等多

  • javascript从右边截取指定字符串的三种实现方法

    截取abcdefg右边的fg 方法一 <script> string="abcdefg" alert(string.substring(string.length-2,string.length)) </script> 方法2 <script> alert("abcdefg".match(/.*(.{2})/)[1]) </script> <script> alert("abcdefg"

  • 使用JavaScript获取Django模板指定键值数据

    Django中利用js来操作数据的常规操作一般为点(.)操作符来获取字典或列表的数据,一般如{{data.0}},{{data.arg}} 但有时如果数据是嵌套类型的数据时,直接获取某个值就变得困难了,比如下面的格式要获取 correct中qxl的值 startArgsSet={"correct":{"qxl":0,"kkx":0},"reliable":{"qxl":0,"kkx":0

  • Javascript中的this,bind和that使用实例

    这篇文章主要介绍了Javascript中的this,bind和that使用实例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 Javascript中必须通过this来访问类成员,可是this的特点就是函数绑在哪个对象上,它就指向那个对象.这个可能困扰过很多的程序员,特别是从C#,Java等语言过来的程序员. function Foo(){ this.message = 'This is message from Foo'; } Foo.prot

随机推荐