JavaScript学习-函数实例

出自：https://blog.csdn.net/xiaowu_hhb/article/details/52789683

1、创建函数

JavaScript 中需要创建函数的话，有两种方法：函数声明、函数表达式，各自写法如下：

第一种：

[html]  view plain  copy

1. function fn() {};     

第二种：

[html]  view plain  copy

1. var fn = function () {};  

此外，可以说还有一种方法，称为“函数构造法”

[html]  view plain  copy

1. var fn = "{name:'color red'}";  
2. var obj = new Function("return"+fn)();  
3. alert(obj.name);//color red  

此方法以一个字符串作为参数形成函数体，但是用这种方法，执行效率方面会打折扣，似乎无法传递参数，所以少用为妙。

2、函数的调用

js的函数调用会免费奉送两个而外的参数就是 this 和 arguments。arguments是参数组，他并不是一个真实的数组，但是可以使用.length方法获得长度。

js的四种调用方法：

• 方法调用模式

• 函数调用模式

• 构造器调用模式

• apply调用模式

（1）方法调用模式

[html]  view plain  copy

1. var obj={  
2.     value:0,  
3.     inc:function  () {  
4.         alert(this.value);//this指obj  
5.     }  
6. }  
7. obj.inc();  

（2）函数调用模式

[html]  view plain  copy

1. var add = function(a, b) {  
2.             alert(this) >//this被绑顶到window  
3.             return a + b;  
4.         }  
5.         var sum = add(3, 4);  
6.         alert(sum);  

(3)构造器调用模式

[html]  view plain  copy

1. var quo = function(string) {  
2.             this.status = string;  
3.         }  
4.         quo.prototype.get_status = function() {  
5.             return this.status;  
6.         }  
7.         var qq = new quo("aaa");  
8.         alert(qq.get_status());  

（4）apply调用模式

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

apply接收两个参数，第一个是要绑定的对象（this指向的对象）,第二个是参数数组。

[html]  view plain  copy

1. function MyObject(name) {  
2.             this.name = name || 'MyObject';  
3.             this.value = 0;  
4.             this.increment = function(num) {  
5.                 this.value += typeof(num) === 'number' ? num : 0;  
6.             };  
7.             this.toString = function() {  
8.                 return '[Object:' + this.name + ' {value:' + this.value + '}]';  
9.             }  
10.             this.target = this;  
11.         }  
12.   
13.         function getInfo() {  
14.             return this.toString();  
15.         }  
16.         var myObj = new MyObject();  
17.         alert(getInfo.apply(myObj)); //[Object:MyObject {value:0}],this指向myObj   
18.         alert(getInfo.apply(window)); //[object Window],this指向window   

3、函数的参数

参数用于将数据传递到函数内部。当然，如果不用参数传递，在函数内部也可以访问外部的变量，那为什么还要参数呢？

1.封装：有了参数，函数内部就不用关心外部的东西，只负责自己处理自己的东西即可。
2.如果你使用参数，那么你在函数内部修改了参数的值，外部的值就不会受到影响，如果你直接操作函数外部的值，那可就危险了。（当然，不是所有参数的修改都不会被影响，如果是引用传递，那么外部的值会同时改变）。

[html]  view plain  copy

1. function fn1() {  
2.         alert("hello");  
3.     }  

[html]  view plain  copy

1. function fn2(str) {  
2.         str=2;  
3.         return str;  
4.     }  
5.     alert(fn2());  

第一个为无参函数，第二个为有参函数。并且有参函数里面有返回值return str，外部调用函数的时候才能拿到里面参数的值。