JS函数function

一.函数介绍

函数： 函数就是封装了一段可以被重复执行调用的代码块 

目的： 就是让大量代码重复使用。

二.函数使用

函数使用分为两步： 声明函数 和 调用函数

// 1. 声明函数
        // function 函数名() {
        //     // 函数体
        // }
function sayHi() {
        console.log('hi~~');

 }

(1) function 声明函数的关键字 全部小写 

(2) 函数是做某件事情，函数名一般是动词 sayHi 

(3) 函数不调用自己不执行

// 2. 调用函数
// 函数名();
sayHi();
// 调用函数的时候千万不要忘记加小括号

三.函数的参数

1.带参数的函数

 我们可以利用函数的参数实现函数重复不同的代码

function 函数名(形参1,形参2...) {

 // 在声明函数的小括号里面是 形参 （形式上的参数）

}

 // 函数名(实参1,实参2...); // 在函数调用的小括号里面是实参（实际的参数）

形参和实参的执行过程
 function cook(aru) { // 形参是接受实参的  aru = '酸辣土豆丝' 形参类似于一个变量
         console.log(aru);
}
cook('酸辣土豆丝');
cook('西红柿炒蛋');

函数的参数可以有，也可以没有个数不限。

2.函数形参实参个数匹配

// 函数形参实参个数匹配
function getSum(num1, num2) {
    console.log(num1 + num2);
}
getSum(1, 2);
getSum(1, 2, 3);
getSum(1); // NaN

1. 如果实参的个数和形参的个数一致 则正常输出结果。

2. 如果实参的个数多于形参的个数  会取到形参的个数 

3. 如果实参的个数小于形参的个数  多于的形参定义为undefined  最终的结果就是 NaN

  形参可以看做是不用声明的变量  num2 是一个变量但是没有接受值  结果就是undefined 

建议： 我们尽量让实参的个数和形参相匹配

四.函数的返回值

有的时候，我们会希望函数将值返回给调用者，此时通过使用 return 语句就可以实现。

函数的返回值格式

function 函数名() {
    return 需要返回的结果;
}
函数名();

(1)我们函数只是实现某种功能，最终的结果需要返回给函数的调用者函数名() 通过return 实现的

(2) 只要函数遇到return 就把后面的结果 返回给函数的调用者  函数名() = return后面的结果

代码验证：

 function getSum(num1, num2) {
    return num1 + num2
}
console.log(getSum(1, 3));//4

函数返回值注意事项:

1. return 终止函数。return 后面的代码不会被执行。

2. return 只能返回一个值，也可以是个数组。

3.我们的函数如果有return 则返回的是 return 后面的值，如果函数么有 return 则返回undefined

五.函数的内部属性

只有在函数内部才能访问的属性。

arguments 的使用

只有函数才有 arguments对象  而且是每个函数都内置好了这个arguments。

是类数组对象，包含着传入函数中参数，arguments对象还有一个callee的属性，用 来指向拥有这个arguments对象的函数。

function fn() {
console.log(arguments); // 里面存储了所有传递过来的实参  arguments = [1,2,3]
console.log(arguments.length);// 个数 3
console.log(arguments[2]);// 从零开始第二个 3
我们可以按照数组的方式遍历arguments
for (var i = 0; i < arguments.length; i++) {
         console.log(arguments[i]);
   }
}
fn(1, 2, 3);// 1 2 3
fn(1, 2, 3, 4, 5);// 1 2 3 4 5

注意：

arguments是伪数组 并不是真正意义上的数组

1. 具有数组的 length 属性

2. 按照索引的方式进行存储的

3. 它没有真正数组的一些方法 pop()  push() 等等

this

指向的是函数赖以执行的环境对象，通常谁调用指向谁。

六.函数声明的两种方式

1. 利用函数关键字自定义函数(命名函数)

function fn() {
    //代码块
}
fn();

2. 函数表达式(匿名函数)

var 变量名 = function() {};

var fun = function (aru) {
    console.log('我是函数表达式');
    console.log(aru);
}
fun('你好啊');//你好啊

七.作用域

 1.JavaScript作用域 ： 就是代码名字（变量）在某个范围内起作用和效果 目的是为了提高程序的可靠性更重要的是减少命名冲突

2. js的作用域（es6）之前 ： 全局作用域   局部作用域 

3. 全局作用域： 整个script标签 或者是一个单独的js文件

4. 局部作用域（函数作用域） 在函数内部就是局部作用域 这个代码的名字只在函数内部起效果和作用

变量的作用域

根据作用域的不同我们变量分为全局变量和局部变量。

1. 全局变量

在全局作用域下的变量 在全局下都可以使用

注意 如果在函数内部 没有声明直接赋值的变量也属于全局变量

 var num = 10; // num就是一个全局变量
console.log(num);//10

function fn() {
    console.log(num);//10
}
fn();

2. 局部变量   

在局部作用域下的变量,在函数内部的变量就是局部变量。

注意： 函数的形参也可以看做是局部变量

function fun(aru) {
    var num1 = 10; // num1就是局部变量 只能在函数内部使用
    num2 = 20;// 注意 如果在函数内部 没有声明直接赋值的变量也属于全局变量
}
fun();
// console.log(num1); // 报错，未定义
console.log(num2);  //20

3. 从执行效率来看全局变量和局部变量

(1) 全局变量只有浏览器关闭的时候才会销毁，比较占内存资源

(2) 局部变量 当我们程序执行完毕就会销毁， 比较节约内存资源

注意： js中没有块级作用域  js的作用域： 全局作用域  局部作用域  现阶段js没有块级作用域

js 也是在 es6 的时候新增的块级作用域

块级作用域 {}   if {}  for {}