zoukankan      html  css  js  c++  java
  • 函数调用模式

    在javascript中一共有四种调用模式:方法调用模式、函数调用模式、构造器调用模式和apply调用模式。这些模式在如何初始化关键参数this上存在差异。

    方法调用模式

    当一个函数被保存为对象的一个属性时,我们称之它为该对象的一个方法,那么this被绑定到该对象上。

    var myObject={
    	name : "myObject" ,
    	value : 0 ,
    	increment : function(num){
    		this.value += typeof(num) === 'number' ? num : 0;
    	} ,
    	toString : function(){
    		return '[Object:'+this.name+' {value:'+this.value+'}]';
    	}
    }
    alert(myObject);//[Object:myObject {value:0}]

    函数调用模式

    当一个函数并非一个对象的函数时,那么它被当作一个函数来调用,this被绑定到全局对象上。这是语言设计的一个错误。倘若语言设计正确,当内部函数调用时,this应该仍然绑定到外部函数的this变量上。如:

    var myObject={
    	name : "myObject" ,
    	value : 0 ,
    	increment : function(num){
    		this.value += typeof(num) === 'number' ? num : 0;
    	} ,
    	toString : function(){
    		return '[Object:'+this.name+' {value:'+this.value+'}]';
    	},
    	getInfo:function(){
    		return (function(){
    			return this.toString();//内部匿名函数中this指向了全局对象window
    		})();
    	}
    }
    alert(myObject.getInfo());//[object Window]

    当幸运的是,有一个很容易的解决方案:定义一个变量并给它赋值为this,那么内部函数通过该变量访问到指向该对象的this,如:

    var myObject={
    	name : "myObject" ,
    	value : 0 ,
    	increment : function(num){
    		this.value += typeof(num) === 'number' ? num : 0;
    	} ,
    	toString : function(){
    		return '[Object:'+this.name+' {value:'+this.value+'}]';
    	},
    	getInfo:function(){
    		var self=this;
    		return (function(){
    			return self.toString();//通过变量self指向myObject对象
    		})();
    	}
    }
    
    alert(myObject.getInfo());//[Object:myObject {value:0}]

    构造器调用模式

    JavaScript是一门基于原型继承的语言。这意味着对象可以直接从其他对象继承属性。该语言是无类别的。

    如果一个函数前面带上new来调用,那么将创建一个隐藏连接到该函数的prototype成员的新对象,同时this将会被绑定到构造函数的实例上。

    function MyObject(name){
    	this.name=name || 'MyObject';
    	this.value=0;
    	this.increment=function(num){
    		this.value += typeof(num) === 'number' ? num : 0;
    	};
    	this.toString=function(){
    		return '[Object:'+this.name+' {value:'+this.value+'}]';
    	}
    	this.target=this;
    }
    
    MyObject.prototype.getInfo=function(){
    	return this.toString();
    }
    /*
     同时创建一个MyObject.prototype对象,myObject继承了MyObject.prototype的所有的属性,
     this绑定到了MyObject的实例上
    */
    var myObject=new MyObject();
    var otherObject=new MyObject();
    //alert(myObject.target===myObject);//ture
    //alert(myObject.target.getInfo());//[Object:MyObject {value:0}]
    myObject.increment(10);
    otherObject.increment(20);
    alert(myObject.value);//10
    alert(otherObject.value);//20

    Apply 调用模式

    JavaScript是一门函数式的面向对象编程语言,所以函数可以拥有方法。

    函数的apply方法,如同该对象拥有此方法,使该对象拥有此方法。此时this指向该对象。

    apply接收两个参数,第一个是要绑定的对象(this指向的对象),第二个是参数数组.

    function MyObject(name){
    	this.name=name || 'MyObject';
    	this.value=0;
    	this.increment=function(num){
    		this.value += typeof(num) === 'number' ? num : 0;
    	};
    	this.toString=function(){
    		return '[Object:'+this.name+' {value:'+this.value+'}]';
    	}
    	this.target=this;
    }
    
    function getInfo(){
    	return this.toString();
    }
    
    var myObj=new MyObject();
    alert(getInfo.apply(myObj));//[Object:MyObject {value:0}],this指向myObj
    alert(getInfo.apply(window));//[object Window],this指向window
  • 相关阅读:
    linux内核中GNU C和标准C的区别
    linux内核中GNU C和标准C的区别
    Getting start with dbus in systemd (02)
    Getting start with dbus in systemd (01)
    Getting start with dbus in systemd (03)
    物理内存相关的三个数据结构
    数据类型对应字节数(32位,64位 int 占字节数)
    Linux kernel 内存
    共模电感的原理以及使用情况
    [原创]DC-DC输出端加电压会烧毁
  • 原文地址:https://www.cnblogs.com/fxair/p/2302046.html
Copyright © 2011-2022 走看看