3.原生js——函数

一、函数声明
一个函数定义（也称为函数声明，或函数语句）由一系列的function关键字组成，依次为：

1、函数的名称。
2、函数参数列表，包围在括号中并由逗号分隔。
3、定义函数的 JavaScript 语句，用大括号{}括起来。

function functionname(){ //functionname为函数名
   //这里是要执行的代码
};

二、函数调用
调用函数通过函数名称()的形式调用

functionname();

三、函数表达式

var functionName = function(){
    console.log('LiLi');
};

functionName();//调用

四、参数

function functionName(name){  //name为参数
    console.log(name); //在控制台打印name

};

functionName('你好') //调用传递参数

形参：指函数定义时候的参数，在这里就是name。
实参：调用函数的时候传入的值。

函数.png

五、arguments

arguments 是一个对应于传递给函数的参数的类数组对象。

arguments对象是所有（非箭头）函数中都可用的局部变量。你可以使用arguments对象在函数中引用函数的参数。此对象包含传递给函数的每个参数的条目，第一个条目的索引从0开始

function sum(a,b){
   console.log(arguments[0]+arguments[1]) //3+5
   console.log(arguments[0]+arguments[2]) //3+4
}

 sum(3,5,4)

输出
//8
//7

arguments修改参数：

function sum(a,b){
  arguments[0] = 9
  console.log(a+b) // 9 + 5

}

sum(3,5)

输出
//14

六、返回值

1.有时候我们希望在函数执行后给我们一个反馈，就像表达式一样，给我们个结果，我们可以通过return来实现
2.在使用 return 语句时，函数会停止执行，并返回指定的值。

例1：

function fn(a, b){
    a++;
    b++;
    return a + b;
}

var result = fn(2, 3);
console.log(result); //输出7

例2：

function fn2(a,b){
   if (a>b){
      return;
    }
   console.log(a + b)
}
fn2(5，2)

例2说明：如果 a 大于 b，则上面的代码将退出函数，并不会计算 a 和 b 的总和。

七、声明提前

正常函数

sum(2,5)

function sum(a,b){
  return a + b
}

输出
//7

..................分割线..................

//浏览器认为这样写
function sum(a,b){
  return a + b
}
sum(2,5)

函数表达式

fn() //报错

var fn = function(){
   console.log('声明前置')
}

..................分割线..................

//浏览器认为这样写
var fn
fn()
fn = function(){
   console.log('声明前置')
}

八、立即执行函数

优点：
1、 使这段代码被载入时候自动执行。
2、 避免污染全局变量。

//这两种模式都可以被用来立即调用一个函数表达式，利用函数的执行来创造私有变量

(function () { /* code */ } ());//括号内的表达式代表函数立即调用表达式
(function () { /* code */ })(); //括号内的表达式代表函数表达式

//如果你并不关心返回值，或者让你的代码尽可能的易读，你可以通过在你的函数前面带上一个一元操作符来存储字节

!function(){/* code */}();
~function(){/* code */}();
-function(){/* code */}();
+function(){/* code */}();