Home > Web Front-end > JS Tutorial > Add method implementation code to JavaScript type (increase function)_javascript skills

Add method implementation code to JavaScript type (increase function)_javascript skills

WBOY
Release: 2016-05-16 17:57:49
Original
1136 people have browsed it

JavaScript type functions (such as Number/String/Boolean/Array/Date/Obejct, etc.) are all inherited from Function.prototype, so adding methods to Function.prototype will also affect the underlying type functions derived from it. For example:

Copy code The code is as follows:

Function.prototype.addMethod=function(methodName, func){
if(!this[methodName]){
this[methodName]=func;//Add a method to the type, similar to the static method of the type. The func method is assigned to the type rather than the instance.
}
return this;//this will be bound to the calling object (type function) of the method. Returning this can make chain calls
}
Array.addMethod('testFun',function( ){alert(this)});
//Array.testFun(); //function Array() {[native code]}
Object.addMethod('testFun',function(){alert(this )});
//Object.testFun(); //function Object() {[native code]}
Boolean.addMethod('testFun',function(){alert(this)});
//Boolean.testFun(); //function Boolean() {[native code]}
function CustomObject(name,value){
this.name=name || 'CustomObject';
this.value=value || 0;
this.toString=function(){return '[name:' this.name ',value:' this.value ']'}
}
CustomObject. addMethod('testFun',function(){alert(this)});
/* return:
* function CustomObject(name, value) {
this.name = name || "CustomObject";
this.value = value || 0;
this.toString = function () {return "[name:" this.name ",value:" this.value "]";};
}
*/
CustomObject.testFun();

If you call it with an instance at this time, an error will be reported. For example:
Copy code The code is as follows:

var customObject=new CustomObject(); // Define a CustomObject instance
customObject.testFun();//Error: temp.testFun is not a function

Add methods to the instance
If you add methods to the type instance, you should add Methods are bound to the type's prototype. For example,
Copy code The code is as follows:

Function.prototype.addMethod=function(methodName,func ){
if(!this.prototype[methodName]){
this.prototype[methodName]=func;//Add a method to the prototype, this method will affect instances of this type
}
return this.prototype;//Return the prototype, this type of instance can be called in a chain
}
Object.addMethod('testFun',function(){alert(this)});
/ /({toString:function(){return '[Empty Object]'}}).testFun(); //[Empty Object]
Number.addMethod('testFun',function(){alert(this)} );
//(5).testFun(); //5
String.addMethod('testFun',function(){alert(this)});
//'test'.testFun (); //'test'
Boolean.addMethod('testFun',function(){alert(this)});
//true.testFun(); //true
Array.addMethod ('testFun',function(){alert(this)});
//(['a','b']).testFun(); //a,b
Date.addMethod(' testFun',function(){alert(this)});
//new Date().testFun(); //Tue Dec 27 2011 11:20:58 GMT-0800 (Pacific Standard Time)
function CustomObject(name,value){
this.name=name || 'CustomObject';
this.value=value || 0;
this.toString=function(){return '[name: ' this.name ',value:' this.value ']'}
}
CustomObject.addMethod('testFun',function(){alert(this)});
var customObject=new CustomObject ();
customObject.testFun(); //[name:CustomObject,value:0]

If testFun is called with type at this time, an error will be reported. For example,
Copy code The code is as follows:

Array.addMethod('testFun',function() {alert(this)});
//Array.testFun(); //Error: Array.testFun is not a function
CustomObject.addMethod('testFun',function(){alert(this)} );
CustomObject.testFun(); //Error: CustomObject.testFun is not a function
Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template