Prototype method. . . . prototype
For example, define a function for the array Array
Array.prototype.in_array = function ($string) { for (var i = 0; i
{
for (i = 0; i
return true;
}
}
return false;
}
You can do it when you call it
var a = new Array('a');
a.in_array('a');
Check if it exists
In example string
String.prototype.trim = function()
{
return this.replace(/^\s*|\s*$/g, '');
}
You can do it when you call it
var a = ' abcdefg ';
a.trime();
This will remove the spaces on both sides
The same goes for custom functions. First create a function and add methods to it using prototype.
Several ways to define Javascript objects
1. Factory method: First create the object, and then add methods and properties to the object. After closure, avoid using the new operator to create objects. Although this approach has some drawbacks, such as when defining a method inside a factory function, a new function will be created every time it is called.
function factory(name, person, address, time){
var tmp=new Object;
tmp.name=name;
tmp.person=person;
tmp.address=address;
tmp.workTime=function(){
alert("The time we start working is " time);
}
return tmp;
}
var factory1 = factory("drugs", 100, "Huashan Rd", 10);
var factory2 = factory("TCMdrugs", 100, "hongqiao Rd", 11);
factory1.workTime();
factory2.workTime();//Here, factory1 and factory2 have different methods
Although this problem can be improved in the following way, it lacks good encapsulation
function factory(name, person, address, time){
var tmp=new Object;
tmp.name=name;
tmp.person=person;
tmp.address=address;
tmp.workTime=workTime();
return tmp;
}
function workTime(){
alert("The time we start working is" this.time);
}
2. The constructor method refers to using the this keyword inside the constructor to create an object, and it needs to be instantiated through the new operator when using it. However, this method has the same problem as the factory method, that is, each time the constructor is called, a new function object will be created, resulting in repeated creation of the function.
function construct(name, person, address, time) { //Write your code logic here }
this.name=name;
this.person=person;
this.address=address;
this.workTime=function(){
alert("The time we start working is" this.time);
};
}
3. Prototype method: Use the prototype attribute to implement attributes and methods. You can check the object type through instanceof, which solves the problem of repeatedly creating functions. However, it should be noted that properties cannot be initialized by passing parameters.
function Car(){
}
Car.prototype.color = "red";
Car.prototype.doors = 4;
Car.prototype.mpg = 23;
Car.prototype.showColor = function() {
alert(this.color);
};
var car1 = new Car();
var car2 = new Car();
But if you encounter the following situation, something goes wrong again
Car.prototype.drivers = ["mike", "sue"];
car1.drivers.push("matt");
alert(car1.drivers); //Output "mike,sue,matt"
alert(car2.drivers); // Output "mike, sue, matt"
drivers are pointers to Array objects, and both instances of Car refer to the same array.
4. Mixed constructor/prototype method: solution to prototype method
function Car(sColor, iDoors, iMpg) { this.color = sColor; this.doors = iDoors; this.mpg = iMpg; }
this.color = sColor;
this.doors = iDoors;
this.mpg = iMpg;
this.drivers = ["mike", "sue"];
}
Car.prototype.showColor = function () { // your code }
alert(this.color);
};
var car1 = new Car("red", 4, 23);
var car2 = new Car("blue", 3, 25);
car1.drivers.push("matt");
alert(car1.drivers);
alert(car2.drivers);
5. Dynamic prototype method: This is a very recommended method. It avoids the problems in the previous methods and provides a more friendly coding style.
function Car(sColor, iDoors, iMpg) { this.color = sColor; this.doors = iDoors; this.mpg = iMpg; }
this.color = sColor;
this.doors = iDoors;
this.mpg = iMpg;
this.drivers = ["mike", "sue"];
If (typeof Car.initialized == "undefined"){
Car.prototype.showColor = function () { // your code }
alert(this.color);
};
Car.initialized = true;
}
}
var car1 = new Car("red", 4, 23);
var car2 = new Car("blue", 3, 25);
car1.drivers.push("matt");
alert(car1.drivers);
alert(car2.drivers);
6. Mixed factory method: It is somewhat similar to the factory method, but uses the new keyword for instantiation. Although it has the same disadvantages as the factory method, it is not recommended.
The above is the detailed content of How does JavaScript define a hide-like method that can be called with a click. For more information, please follow other related articles on the PHP Chinese website!