函数

2018-09-25 本文已影响0人致自己_cb38

1. 函数（方法）：

实现了某一个功能的操作的集合。
函数的原则：功能单一。

2. 函数的定义(申明)：

函数的定义并不会执行函数，函数生效是在调用的地方。

2.1 使用函数的关键字function申明

function name(){
    
}

2.2 使用函数表达式申明。一般使用的是匿名函数

var func = function(){
    
};

Odiv.onclick = function(){
    
};

2.3对象申明法

var func = new Function(a,b,c,'return a+b;')
var func = function(a,b,c){
    return a+b;
}

3.函数的重复申明

函数的重复申明类似于变量的重复赋值，后面的会覆盖前面的。所以生效的永远是后面的函数。

4. 函数的提升

函数的提升类似于变量的提升，在JS里面所有的变量申明以及函数申明都会在执行代码之前运行。
函数内部的变量申明，也会出现变量的提升，但是这个提升只能提升到函数的最前面，不能提升到函数的外部。

5.（）

申明的时候，括号里面是放置参数的，不能省略，即使没有参数也要有。
调用的时候，括号里面传入的是实际的数据，表示函数的执行。

6. 函数的参数

JS参数的意义：能够获取到外面的“值”，但是里面的修改不会影响到外面。
形参：形式参数，函数定义的括号里面的，只能是一个变量。相当于一个占位符，没有实际意义，只是方便函数里面去获取外面的数据。相当于给函数的内部申明了一个变量，不过这个变量可以获取外面的数据。
实参：实际参数，函数调用的时候传入函数内部的数据。必须是具体的值或者变量。

7. 作用域

概念：变量起作用的区间
全局作用域：函数外面的叫做全局作用域
局部作用域：函数内部的作用域叫做局部作用域
全局作用域的变量能够在任何地方使用，局部作用域的变量只能在函数的内部使用，不能再函数的外部使用。
作用域链：
- JS所特有的。一个变量在函数内部找不到的时候，回去函数外部查找，如果一直到最外部（window）没找到那么就产生not defined 错误，但是有时候并不是单纯的内部与外部关系，而是很多层。这个时候内部要查找的时候就要一层一层向外查找，直到找到为止。这个就是作用域链。

8.返回值。

一个函数是实现某一个功能的，实现了没有怎么判断？
计算任意一个数及小于这个数的所有数字的和。
eg:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
<script>
function sum(n){
    var sum = 0;
    for(var i=1;i<n+1;i++){
        sum+=i;
    }
    return sum;
}
console.log(sum(10000));
</script>
</body>
</html>

函数执行完成之后，内部的结果想要告诉函数的调用者。那么就要使用函数的返回值，函数的返回值只能有一个。
语法是在所有的函数内部的语句之后添加一条return语句。想要返回什么就在return后面写什么。
任何调用这个函数的地方都可以会去到这个返回值。

9.函数申明的优先级

如果一个表达式申明的函数与一个使用function关键字申明的函数具有相同的调用方式。那么最终生效的永远是表达式申明的函数，也就是说表达式申明的函数优先级高。
eg:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
<script>
function a(){
    console.log(2);
}
var a = function(){
    console.log(1);
};
a(); //1
</script>
</body>
</html>

10.不要在if以及所有判断里面申明函数。

11.函数的属性以及方法。

面向对象。函数也是一个对象。对象就是具有方法以及属性的一个个头。
name属性：函数名。
length属性：形参参数的个数。
toString():函数字符串自己。

12.参数

参数的默认值。有的参数并不是必须要传递的，没有传递的时候可以设置一个默认的来执行。这个时候就可以使用默认值语法。
一般来说函数的在调用的时候传递的参数的个数要和函数申明的时候申明的参数的个数要一致。如果某一个参数没有传递，那么实参与形参的对应关系式从前向后的。也就是说后面的参数总是被先省略。

13.参数的传递方式

值传递：
var a = 10;
b = a;
b = 11;
a = 10
对于简单数据类型的参数传递使用的就是值传递。（数字，字符串，布尔值）。


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
<script>
var a  = 100;
function s(m){
    console.log(m);
    console.log(a);
    m =  0;
    console.log(m);
    console.log(a);
}
s(a);
console.log(a);
console.log(m);
</script>
</body>
</html>

引用传递（地址传递)：


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
<script>
var zhangsan = {};//对象
zhangsan.age = 18;
zhangsan.height = 178;
zhangsan.weight = 180;
function s(b){
    b.age = 22;
}
s(zhangsan);
console.log(zhangsan.age); //22
</script>
</body>
</html>

14.arguments对象

参数对象，能够在函数的内部获取到所有传入的参数的集合。
是一个类数组对象。
出现原因：
- 如果传入的参数的个数是不确定的。例如：返回传入n个参数的最大值。
  eg:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
<script>
function max(){
    var s = arguments;
    var max = s[0];
    for(var i=1;i<s.length;i++){
        if(s[i]>max){
            max = s[i];
        }
    }
    return max;
}
console.log(max(2,5,8,2,4,7,11,-45,-111,12617,67));
</script>
</body>
</html>

申明函数的时候参数的个数比调用函数的时候传入的参数个数少。
eg:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
<script>
function s(a,b){
    console.log(arguments);
}
s(3,1,4,4,6,8,0,7,2);
</script>
</body>
</html>

15.函数分类

系统函数，ＪＳ自己定义好的函数
自定义函数，用户自己定义的函数
匿名函数：没有名称的函数，这个函数只是定义的时候直接赋值生效。
立即函数（自执行函数）：就是函数在定义的时候自动调用一次。
不能使用在函数关键字申明的函数后面直接加上小括号，不表示执行，因为JS的解析器认为function开始的语句就是函数定义。
表达式申明：可以使用表达式申明的函数后面加上小括号表示执行。
格式：
(function s(){}());
(function(){})();
利用上面的这个自执行的特点，可以实现用户的一个局部作用域空间，这样可以防止变量的污染。
其实对于JS解析器来说只要不是使用function开始申明的函数都是可以加上小括号表示自执行的。
eg:
!function s(){}();
~function(){}();
+function(){}();
-function(){}();

16.回调函数

就是在某一个地方（函数内部）根据一个条件去调用其他函数。在不修改原代码的基础上实现新的功能。
对修改封闭，对扩展开放。开放封闭原则。
eg:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
<script>
function jisuan(a,b,yunsuan){
    return yunsuan(a,b);
}
function jia(a,b){
    return a+b;
}
function jian(a,b){
    return a-b;
}
function chen(a,b){
    return a*b;
}
function chu(a,b){
    return a/b;
}
function quyu(a,b){
    return a%b;
}
var jieguo = jisuan(2,3,quyu);
console.log(jieguo);
</script>
</body>
</html>

17.递归函数

在函数的内部自己调用自己实现某一个操作。
递归函数是一定具有结束条件的，没有结束条件就变成了死循环。
eg:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
<script>
/*
function a(num){
    console.log(num);
    if(num==1){
        return false;
    }
    a(num-1);
}
a(78); //1——78
*/
//计算任意数字以内所有正数的和。 100 + 99 +98 + 。。。 +1

function sum(num){
    if(num==1){
        return 1;
    }
    return num+sum(num-1);
}
console.log(sum(100));
</script>
</body>
</html>

函数

1. 函数（方法）：

2. 函数的定义(申明)：

3.函数的重复申明

4. 函数的提升

5.（）

6. 函数的参数

7. 作用域

8.返回值。

9.函数申明的优先级

10.不要在if以及所有判断里面申明函数。

11.函数的属性以及方法。

12.参数

13.参数的传递方式

14.arguments对象

15.函数分类

16.回调函数

17.递归函数

猜你喜欢

热点阅读