JS之call/apply/bind

测试代码:

var a = 1;
var obj = {
     a = 2;
}

function test(a){
    alert(a);
    alert(this.a);
}

1.test(3);

结果:3,1

函数中this指向window对象

2.test.call(thisObj,param1,param2....);

  thisObj:test函数中this的指向

  param1,param2...:传给test函数的参数

3.test.call(null,3)或者test.call(undefined,3);

结果为:1,3;

当thisObj是undefined或者null时,test中的this指向window

4.test.call(1,3);或者test.call("a",3)或者test.call(false,3)或者test.call([12],3)或者test.call(function(){},3)或者test.call(/ao/g,3);时

结果为:3,undefined

此时this的值为1,"a",flase,[12],function(){},/ao/g;里面没有a属性

5.test.call(obj,3);

结果为:3,2

6.test.apply(thisObj,[param1,param2...]);

除了给test传参数以数组形式,其他和test.call一样

7.test.bind(thisObj,param1,pamra2...);

bind()返回新的函数,这个函数是test的复制,但是里面的this指向thisObj

源码:

Function.prototype.bind = function(scope){
  var fn = this;
  return function(){
      fn.apply(scope);
   }
}

案例:

1.

var x = 100;
var foo = {
    x:200
    }
var bar = function(a,b){
    console.log(this.x,a,b);
}
bar(1,2);
var nBar = bar.bind(foo,4,5);
nBar();

bar(1,2)打印出:100,1,2;this指向widdow;

nBar()打印出:200,4,5;this指向foo,而且nBar在创建时,将4,5保存到nBar的参数列表中

2.

var x = 100;
var foo = {
    x:200
}
var bar = function(a,b){
    console.log(this.x,a,b);
    console.log(arguments);
}
bar(1,2);
var nBar = bar.bind(foo,4,5);
nBar(6,7);

nBar执行时:arguments里面保存了4,5,6,7

3.

时间: 2024-11-15 22:27:32

JS之call/apply/bind的相关文章

js 的 call apply bind 方法

js的call apply bind 方法都很常见,目的都是为了改变某个方法的执行环境(context) call call([thisObj[,arg1[, arg2[,   [,.argN]]]]]) thisObj可选项.将被用作当前对象的对象.arg1, arg2, argN ..可选项.将被传递方法参数序列. 如果没设置严格模式 “use strict” 当thisObj 不存在或 为 undefined 或为 null 或为 this 时,则隐式地指向 全局对象(在浏览器中即为 wi

JS中call,apply,bind方法的总结

why?call,apply,bind干什么的?为什么要学这个? 一般用来指定this的环境,在没有学之前,通常会有这些问题. var a = { user: "小马扎", fn: function(){ console.log(this.user); } } var b = a.fn; b(); // undefined 我们是想打印对象a里面的user却打印出来undefined是怎么回事呢?如果我们直接执行a.fn()是可以的. var a = { user: "小马扎

js: this,call,apply,bind 总结

对js中的一些基本的很重要的概念做一些总结,对进一步学习js很重. 一.this JavaScript 中的 this 总是指向一个对象,而具体指向那个对象是在运行时基于函数的执行环境动态绑定的,而非函数声明时的环境     实际应用中 this 的指向大致可以分为以下 4 中:         1. 作为对象的方法调用         2. 作为普通函数掉用         3. 构造器调用         4. Function.prototype.call 或 Function.proto

原生JS实现call,apply,bind函数

1. 前言 使用原生JS实现call和apply函数,充分了解其内部原理.call和apply都是为了解决改变this的指向.作用都相同,只是传参的方式不同.除了第一个参数外,call可以接受一个参数列表,apply只接受一个参数数组. 2. call函数 2.1 描述 call() 方法使用一个指定的 this 值和单独给出的一个或多个参数来调用一个函数. 2.2 语法 fun.call(thisArg, arg1, arg2, ...) 2.3 参数 thisArg:可选的.在 fun 函数

js 对call apply bind理解

请参考 http://www.cnblogs.com/xljzlw/p/3775162.htmlcall applyvar mtt = { name: "mtt", sayHello: function (age) { console.log("hello, i am ", this.name + " " + age " years old"); } }; var xjs = { name: "xjs ",

js的call,apply,bind的使用与区别

在原生js中会有三个很常见的函数,call,apply,bind 他们的作用就是改变当前函数的this指针, 但是细微来说他们还是有不同的. 1)call,apply都是执行某一函数,发现this有变得时候才使用的(进行时) 2)bind是在函数进行调用之前,就强行给变了this的指向(进行前),它的效果是返回一个函数(只是给变了this指向) 说的很多了,不说了 demo : function Foo(name){ this.name=name; } Foo.prototype.getName

前端JS面试题汇总 Part 3 (宿主对象与原生对象/函数调用方式/call与apply/bind/document.write)

原文:https://github.com/yangshun/front-end-interview-handbook/blob/master/questions/javascript-questions.md 最近将持续翻译JavaScript面试题,希望对各位有所帮助. (文章中斜体字部分为译者添加) 目录: Part 1(事件委托/this关键字/原型链/AMD与CommonJS/自执行函数) Part 2 (null与undefined/闭包/foreach与map/匿名函数/代码组织)

js中的call apply bind简单总结

首先来看一个问题: 那如果此时就想要获取button按钮这个对象怎么解决? 结果: 还可以这样解决? 所以简单来说: call apply bind 的作用就是 改变函数内部this的指向.但是各自有点小区别. 再看: 如果不需要改变this的指向,就传入一个null就行. 应用: 原文地址:http://blog.51cto.com/11871779/2133119

JS中的call(),apply(),bind()方法

call,apply和bind到底有何用? 改变函数的this对象的指向 相似之处 1.都是用来改变函数的this对象指向 2.第一个参数都是this要指向的对象 3.都可以利用后续参数传参 先看下面例子: 例1: var name = "小王", age = 17; var obj = { name:"小张", objAge:this.age, myFun:function(){ console.log(this.name + "年龄" + t