JavaScript functions are different from other languages. Each function is maintained and run as an object. Through the properties of function objects, you can easily assign a function to a variable or pass the function as a parameter. Before continuing, let’s take a look at the syntax of using functions:
Here is a quote:
function func1(…){…}
var func2=function(…){…};
var func3=function func4(…){…};
var func5=new Function();
Copy the code code as follows:
<script type="text/javascript">
// 1, method calling mode
// When a function is saved as a property of an object, we call it a method of the object, then this is bound to the object
var myObject={
name: "myObject",
value: 0,
increment : function(num){
this.value += typeof(num) === 'number' ? num : 0;
return this;
} ,
toString : function(){
return '[Object:' + this.name + ' {value:' + this.value + '}]';
}
}
alert(myObject.increment(10).increment(20).toString()); // [Object:myObject {value:30}]
// 2, function calling mode
// When a function is not a function of an object, it is called as a function, and this is bound to the global object. This is a mistake in language design. If the language design is correct, when the inner function is called, this should still be bound to the this variable of the outer function.
var myObject={
name: "myObject",
value: 0,
increment : function(num){
this.value += typeof(num) === 'number' ? num : 0;
return this;
} ,
toString : function(){
return '[Object:' + this.name + ' {value:' + this.value + '}]';
},
getInfo: function(){
var self=this;
return (function(){
//return this.toString(); // This in the internal anonymous function points to the global object window, and outputs [object Window]
return self.toString(); // Define a variable selft and assign it the value this, then the internal function can access this pointing to the object through this variable
})();
}
}
alert(myObject.increment(10).increment(20).toString()); // [Object:myObject {value:30}]
// 3, constructor calling mode
// JavaScript is a language based on prototypal inheritance, which means that objects can inherit properties directly from other objects, and the language is classless.
// If a function is called with new in front, a new object will be created that hides the prototype member connected to the function, and this will be bound to the instance of the constructor.
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();
}
// Create a MyObject.prototype object at the same time. myObject inherits all the properties of MyObject.prototype. This is bound to the instance of MyObject.
var myObject = new MyObject();
myObject.increment(10);
alert(myObject.value); //10
var otherObject = new MyObject();
otherObject.increment(20);
alert(otherObject.value); //20
alert(myObject.target===myObject); // true
alert(myObject.target.getInfo()); // [Object:MyObject {value:10}]
// 4, Apply calling mode
// JavaScript is a functional object-oriented programming language, so functions can have methods. The apply method of the function is as if the object has this method, and this points to the object.
// apply receives two parameters, the first is the object to be bound (the object pointed to by this), and the second is the parameter array.
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 points to myObj
alert(getInfo.apply(window)); //[object Window], this points to window
// for and while
function func(a,b){
alert(a); // 1
alert(b); // 2
for(var i=0;i<arguments.length;i++){
alert(arguments[i]); // 1, 2, 1, 2, 3
}
var i=0;
while(i<arguments.length){
alert(arguments[i]); // 1, 2, 1, 2, 3
i=i+1;
}
}
func(1,2,3);
var i=0
for (i=0;i<=10;i++) {
document.write("The number is " + i + "<br/>")
}
</script>