javaScript的函数定义方式
Ø 方式一:
Functionabc(p1,p2){
Return p1+p2;
}
Ø 方式二用function定义匿名函数
Function(p1,p2){
Returnp1+p2;
}
Ø 方式三:可以调用function的构造器来构建函数
Var a=function(p1,p2,p3,p4,..pn);
前面的p1,p2,p3,…..pn-1会作为新的形参列表
===============================================================================
Ø Js函数的功能
1当成一个函数来使用
2当成一个类来使用,定义的时候就创建了一个类与一个函数
3函数还可以当成是一个类的方法,即使这样函数依然是独立存在的
只要你定义一个js的函数的时候,就产生了一个类,因此可以通过new来调用他的构函数,javascript里面函数是一等公民,即使把它放在类里面,它也是独立存在的。
===============================================================================
Ø 默认函数调用者,和变量的调用者是windows
function test(){
alert("简单函数");
}
test();
test.call|(window);
等价于
functiontest(){
alert("简单函数");
}
Windows.test();
===============================================================================
Ø 函数的调用方式
方式一:调用者.函数名(调用参数);//调用者可以省略
方式二:函数名.call(调用者,参数列表);
方式三:函数名.apply(调用者,arguments);
-----------------------------------------------------------------------------------------------------------------------
unction Person(name,age){
this.name=name;
this.age=age;
this.info=function(){
alert(this.name+":"+this.age);
}
}
varp=new Person("悟空",5);
function Dog(name,age){
this.name=name;
this.age=age;
}
vard=new Dog("旺财",4);
p.info.call(d);
--------------------------------------------------------------------------------------------------------------
function test(){
alert("简单函数");
}
test();
----------------------------------------------------------------------------------------------------------------
varmyfun=function(a,b){
this.a=a;
this.b=b;
alert(this.a+":"+this.b);
this.test=a+b;
}
varo=new Object();
vara=function(x,y){
myfun.apply(o,arguments);
};
a(2,3);
alert(o.test);
===============================================================================
This前缀的调用作用
当在函数中去调用this的时候,程序只搜索一个位置,只搜索主调对象是否包涵该实例变量的位置。如果不存在就当成undefind处理,如果没有this前缀,程序会搜索当前函数中是否存在局部变量,如果不存在程序会搜索主调对象该实例变量,如果依然不存在就会搜索主调对象的调用对象,一直向上搜索直到搜索到windows对象为止。
函数里面的this是指函数的调用者,谁是函数的调用者,this就是指的谁
===============================================================================
绑定事件监听器的方法
1在html中绑定,在onxxx属性中进行直接绑定,此时onxxxx的属性值可以是一条或者多条js语句。
<scripttype="text/javascript">
var test =function(){
varele=document.createElement("span");
ele.innerHTML="添加的元素";
var br=document.createElement("br");
document.getElementById("target").appendChild(ele);
document.getElementById("target").appendChild(br);
}
</script>
<inputtype="button" value="添加元素" οnclick="test();"/>
-----------------------------------------------------------------------------------------------------------------
2通过dom对象的onxxxx属性来绑定与设置,此时只能是一个函数的引用。
var test =function(){
varele=document.createElement("span");
ele.innerHTML="添加的元素";
var br=document.createElement("br");
document.getElementById("target").appendChild(ele);
document.getElementById("target").appendChild(br);
}
document.getElementById("button").οnclick=test;
<scripttype="text/javascript" src="test.js"></script>放在</body>的前面
var test=function(){
varele=document.createElement("span");
ele.innerHTML="添加的元素";
var br=document.createElement("br");
document.getElementById("target").appendChild(ele);
document.getElementById("target").appendChild(br);
}
//如果要把javascript放在头部,这行代码相当于指定了页面加载完成后
//执行test函数,还有一种方法是把js放在body的尾部
document.body.οnlοad=function(){
document.getElementById("button").οnclick=test;
}
<scripttype="text/javascript" src="test.js"></script>放在<head>里面