invocation 调用
调用一个函数将暂停当前函数的执行，传递控制权和参数给新函数。
实参与形参不一致不会导致运行时错误，多的被忽略，少的补为undefined
每个方法都会收到两个附加参数：this和arguments。this的值取决于调用的模式，调用模式：方法，函数，构造器和apply调用模式
this被赋值发生在被调用的时刻。不同的调用模式可以用call方法实现
var myobject = { value: 0, increment: function (inc) { this.value += typeof inc === 'number' ? inc : 1; } }; myobject.double = function(){ var helper = function(){ console.log(this);// this point to window } console.log(this);// this point to object myobject helper(); } myobject.double();//myobject window
1 the method invocation pattern 方法调用模式
方法：函数被保存为对象的属性.当方法被调用时，this被绑定到该对象
公共方法：通过this取得他们所属对象的上下文的方法
myobject.increment(); document.writeln(myobject.value); //
底层实现： myobject.increment。call(myobject，0);
2 the function invocation pattern 函数调用模式
当函数并非对象的属性时就被当作函数调用（有点废话。。），this被绑定到全局对象（window）
ecmascript5中新增strict mode， 在这种模式中，为了尽早的暴露出问题，方便调试。this被绑定为undefined
var add = function (a,b) { return a + b;}; var sum = add（3，4）；// sum的值为7
底层实现：add.call（window，3，4）
strict mode：add.call（undefined，3，4）
方法调用模式和函数调用模式的区别
function hello(thing) { console.log(this + says hello + thing); } person = { name: brendan eich } person.hello = hello; person.hello(world) // [object object] says hello world 等价于 person。hello。call（person，“world”） hello(world) // [object domwindow]world 等价于 hello。call（window，“world”）
3 the constructor invocation pattern
javascript是基于原型继承的语言，同时提供了一套基于类的语言的对象构建语法。
this指向new返回的对象
var quo = function (string) { this.status = string; }; quo.prototype.get_status = function ( ) { return this.status; }; var myquo = new quo(this is new quo); //new容易漏写，有更优替换 myquo.get_status( );// this is new quo
4 the apply invocation pattern
apply和call是javascript的内置参数，都是立刻将this绑定到函数,前者参数是数组，后者要一个个的传递apply也是由call底层实现的
apply(this,arguments[]); call(this,arg1,arg2...); var person = { name: james smith, hello: function(thing,thing2) { console.log(this.name + says hello + thing + thing2); } } person.hello.call({ name: jim smith },world,!); // output: jim smith says hello world! var args = [world,!]; person.hello.apply({ name: jim smith },args); // output: jim smith says hello world!
相对的,bind函数将绑定this到函数和调用函数分离开来，使得函数可以在一个特定的上下文中调用，尤其是事件bind的apply实现
function.prototype.bind = function(ctx){ var fn = this; //fn是绑定的function return function(){ fn.apply(ctx, arguments); }; }; bind用于事件中 function myobject(element) { this.elm = element; element.addeventlistener('click', this.onclick.bind(this), false); }; //this对象指向的是myobject的实例 myobject.prototype.onclick = function(e) { var t=this; //do something with [t]... };
相信看了本文案例你已经掌握了方法，更多精彩请关注其它相关文章！
推荐阅读：
nodejs操作excel文件
怎样做出下滑页面底部无限加载数据需求
以上就是调用模式与this绑定的详细内容。