04-JavaScript函数

JavaScript中函数一般都分为两类，一类是内置函数，另一类是自定义函数。

内置函数又叫系统函数，系统函数包含字符串对象、数组对象、数学对象、日期对象、正则表达式对象、逻辑对象、数字对象等。

声明函数一般包含三部分：函数名、形式参数、函数体

一、创建函数的方法及调用函数

调用函数的语法

函数名 (实参1, 实参2, .....);

使用对象方法创建

1 <script type="text/javascript">
2             // 使用new关键字，构造函数
3             var fun = new Function("a", "console.log(a)");
4             fun(1);
5             var fun2 = new Function("a", "b", "console.log(a * b)");
6             fun2(1, 2);
7     </script>

注意：

Function();   ()里面的内容只能是JS语句，如果要传递参数，形参要加上""

语法：

new Function("JS语句");

使用函数声明创建一个函数

function fun(){
        console.log("Hello World!");
    }
    fun();

语句：

function(){

　　JS语句;

}

使用函数表达式创建函数

　　var fun = function(){
        console.log("Hello World!");
    }
    fun();

 

语法：

var 函数名 = function(){

　　JS语句;

}

下面使用这三种方法，分别实现两个数字之和这个功能的函数

1.创建函数对象的方法

<script type="text/javascript">
    var num1 = parseFloat(prompt("请输入一个数字:"));
    var num2 = parseFloat(prompt("请输入另一个数字:"));
    var sum = new Function("alert(num1 + num2)");
    sum();
</script>

2.声明函数的方法

<script type="text/javascript">
    function sum(){
        var num1 = parseFloat(prompt("请输入一个数字："));
        var num2 = parseFloat(prompt("请输入另一个数字："));
        return num1 + num2;
    }
    resu = sum();
    alert(resu);
</script>

3.函数表达式

<script type="text/javascript">
    var sum = function(){
        var num1 = parseFloat(prompt("请输入一个数字："));
        var num2 = parseFloat(prompt("请输入另一个数字："));
        return num1 + num2;
    };
    alert(sum());
</script>

二、return

在一个函数中使用return语句之后，后面的代码都不会被执行。

我们执行下面这段代码，再看一下执行效果

1 <script type="text/javascript">
2     function fun(){
3         console.log("Hello World");
4         return;
5         console.log("Hello JS");
6     }
7     fun();
8 </script>
View Code

执行效果如下

 

 return关键字后面可以跟上任何类型的数据，return也可以返回一个函数(函数是一种特殊的对象，具有对象的一切特征，所以返回值也可以是任意的数据类型)

 1 <script type="text/javascript">
 2     
 3     function fun(){
 4         function fun2(){
 5             console.log("Hello World!");
 6         }
 7         return fun2;    // 返回fun2这个函数
 8     }
 9     console.log(fun());
10 </script>
View Code

注意区分一下下面这两个概念：
函数名;　　// 返回函数对象

函数名();　　// 调用函数

 retunrn后面不跟任何值或者没有return函数返回值是undefined

1 <script type="text/javascript">
2     function fun(){
3         return;
4     }
5     console.log(fun());
6 </script>
View Code

代码执行效果如下：

 

三、立即执行的函数

1     <script type="text/javascript">
2         (function(){
3             console.log("Hello World");
4         })();　　　　
5　　　 </script>

执行效果如下图所示：

 

 

下面我们来看一下带有参数的如何使用

1     <script type="text/javascript">
2         (function(a, b){
3             console.log(a + b);
4         })(1, 2);
5     </script>

四、对象属性值为函数

    <script type="text/javascript">
        var person = {
            "name": "孙猴子",
            "age": "无穷",
            "gender": "未知",
            "addr": function(){
                console.log("花果山");
            }
        };
        person.addr();
    </script>

如何查看一个对象里面有哪些属性：

使用for....in.....语句

 1     <script type="text/javascript">
 2         var person = {
 3             "name": "孙猴子",
 4             "age": 1000,
 5             "address": "花果山"
 6         }
 7         for(var n in person){
 8             console.log(n);
 9         }
10     </script>

 

 

1         for(var n in person){
2             console.log(n);
3         }
View Code