菁英数字科技（猩码）-猩码学苑-专注软件开发人才菁英教育

标题: 王涛-20221123-JS高阶01 [打印本页]

作者: 黑桃K 时间: 2022-11-24 09:23
标题: 王涛-20221123-JS高阶01
js高级---day01

js是一门语言，熟练掌握

今日任务

1.执行环境与作用域---能分析清除即可，掌握作用域的分类

2.函数进阶的精通---熟练使用

3.闭包的精通---能清楚的讲解闭包，有什么作用、特点、缺点，与怎么解决

1.执行环境与作用域1.1执行环境和变量对象及作用域       var a = 1;
      function add(n) {
         var b = n + 2;
         function output(c) {
            console.log(a, b, c);
         }
         output(b + 2);
      }
      add(a);

概念

1.标识符：变量名/函数名/形参/对象的键名，统称为标识符

2.作用域：标识符可以被访问的范围，就是作用域

3.执行环境：代码的运行环境，js有两种执行环境，全局执行环境，函数执行环境

4.js执行的环境，都被放入一个栈中

5.作用域链，提供了一套标识符访问的规则，保证标识符有序访问

总结

作用域链提供了一套标识符访问的规则，保证标识符有序访问

规则：从里往外找，查找标识符，找到就是用，停止查找的过程，直到window，找不到，会报错

作用域根据作用域链规则

作用域：标识符可以被访问的范围，自己和自己的后代作用域

1.2作用域分类

1.全局作用域

2.函数作用域/局部作用域

3.块级作用域（ES6新增）：if、for等

2.函数的进阶2.1函数声明方式       //ES5
      //声明式
      f1();
      function f1() {
         console.log('f1');
      }
      //表达式
      // f2();
      let f2 = function () {
         console.log('f2');
      }
      f2();

      //ES6
      //箭头函数
      // f3();
      // var f3 = () => {    //报错方式一样
      let f3 = () => {
         console.log('f3');
      }
      f3();2.2箭头函数可省略的情况1.{}中只有一句代码：省略{}并且同时省略return
2.形参有且只有一个，可以省略()2.3函数的参数

1.形参：占位

2.实参：调用函数时，传入的实际参数

2.4arguments伪数组

是一个伪数组，在函数内部获取到所有实参的集合，可以使用for循环，可以通过小标取值。

2.5设置函数参数的默认值ES5:
function fn(形参){
let 变量=形参||默认值；
}
#如果实参为0，会出问题，所有推荐使用ES6

ES6:
function fn(形参=默认值){

}2.6剩余参数rest箭头函数没有伪数组，只能使用剩余参数
剩余参数是一个真数组，可以使用数组的方法2.7函数的返回值

函数返回什么，就得到什么，函数可以返回任何东西（函数，数组，对象等）

函数没有return，返回值为默认值undefined

函数在哪里调用，

2.8函数的调用直接调用---函数名（实参）
对象的属性和方法调用---对象.方法()
回调---自动执行，自动调用
自己调用自己---自调用函数，立即执行函数表达式IIFT2.9立即执行函数表达式

变量挂载在window上，成为了全局变量，全局的标识符

写js代码，如果全局标识符过多，全局污染

比较容易与其他人的代码冲突

3.闭包

1.跨作用域访问变量，形成闭包，闭包时一种作用域的体现

2.常见的闭包写法是：父函数嵌套子函数，子函数可以访问父函数的变量，把子函数的返回或者挂载在window上

欢迎光临菁英数字科技（猩码）-猩码学苑-专注软件开发人才菁英教育 (http://www.xingmaxueyuan.com/)