JavaScript核心知识点总结(一)

文章目录

        • 一 JS数据类型
            • 数据类型 2+7
            • 数据类型检测
            • "+"字符串拼接
            • Number:NaN/isNaN /Infinity/parseInt/Number()
            • 其他类型转换为数字的方法
            • `==` 的规律
        • 二 JS堆栈内存的运行机制
            • 堆栈内存
        • 三 变量提升机制
        • 四 作用域和作用域链
            • 作用域
            • 作用域链
            • 作用域与执行上下文的区别与联系
        • 五 闭包的两大作用 保存/保护
            • 如何产生闭包:
            • 闭包的作用:
            • 闭包的生命周期:

一 JS数据类型

数据类型 2+7
  1.  基本数据(值)类型: number string Boolean  null undefined symbol bigint(ES6 )
  2. 引用数据类型:object(普通对象 数组对象 正则对象,日期对象 Math数学函数对象)  function
数据类型检测
 1. typeof  检测数据类型的逻辑运算符
     typeof  null   //object  所有的值在内存中都是按照二进制来存储    前  三位为000的为number
     typeof  undefined  //undefined
     typeof  Symbol   //Symbol
     typeof  function  // function
 **特点:**     
    + 返回的结果都是字符串,局限性:  typeof null //object 
    + 不能细分对象类型 (普通对象和数组对象都为Object)  
2. instanceof   检测是否为某个类的实例
3. constructor  检测构造函数
4. Object.prototype.toString.call 检测数据类型
  • 可参考四种检测类型的总结
"+"字符串拼接
Number:NaN/isNaN /Infinity/parseInt/Number()
  1. 什么是数字类型
  2. NaN(不是一个有效数字但是属于number 类型)
  3. Infinity(无穷大也属于number 类型)
  4. `NaN !=NaN `它和谁都不相等包括和自己本身也不相等
  5.   `isNaN(值)`是否为有效数字,如果不是有效数字返回为true,为有效数字返回为false
其他类型转换为数字的方法
  +  强转换(基于底层机制)`Number([value])`
      一些隐式类型转化都是基于Number
     + isNaN('12px'),其他类型转化为数字类型再检测
     + 数学运算 ‘12px’-13
     + 字符串==数字 
  +  弱转换(基于额外的一些方法)`parseInt(),parseFloat()`
     1. parseInt()  处理的值为字符串,遇到非有效的数字字符,
      停止查找,如果处理的值不为字符串,需要先转换为字符   串,然后开始查找。
      2.  Number 直接调用浏览器底层检测机制完成
     如果全都是有效字符才会转换成数字,否则为NaN
== 的规律
1.  对象 == 字符串        对象转换为字符串`toString()`
2. null==undefined       但和其他值不相等
3. 当对象转换为数字时,先转为字符串,在转为数字
4. 任何数据类型都可以转换为字符串
5. NaN==NaN       不相等

二 JS堆栈内存的运行机制

堆栈内存
 1. JS 之所以能在浏览器中运行,是因为浏览器给JS提供了执行环境=》stack内存
 2. 浏览器把内置的一些属性方法放到单独的内存中, 堆内存(Heap)
 3. 作用:
      栈内存提供代码执行环境,堆内存存放的是属性方法
  • ECStack (Executed Context Stack)执行环境栈
  • EC(执行上下文)
    + ECG(全局)
    + 函数代码块(私有)
    + 块级执行上下文
  • GO(golbal object)
  • VO (Variable Object )变量对象当前的上下文中存放变量和值的地方 ,每一个执行上下文中都有自己的变量
  • AO ( Activation Object)活动的变量对象,也是变量对象 函数中的变量对象

三 变量提升机制

  • 例:var a=12
    1. 内存中开辟空间存储12
    2. 定义变量a
    3. 关联a—12
  • let声明的注意点:
    1. 不能提升
    2. 在同一作用域中不能定义相同变量名
  • const 声明注意点
    1. 定义一个常量
    2. 特点,不能修改。注意点同let
    3. 保证的并不是变量的值不得改动,而是指向那个内存地址不能改动
const a=[];       
a.push('hello');  //可执行
a.length=0;    //可执行
a=['D'];      //报错

四 作用域和作用域链

作用域
  1. 理解
    1.1 就是一块"地盘", 一个代码段所在的区域
    1.2 它是静态的(相对于上下文对象), 在编写代码时就确定了
  2. 分类
    2.1 全局作用域
    2.2 函数作用域
    2.3 块作用域(ES6有了)
  3. 作用
    3.1 隔离变量,不同作用域下同名变量不会有冲突
作用域链
  1. 理解
    1.1 多个上下级关系的作用域形成的链, 它的方向是从下向上的(从内到外)
    1.2.查找变量时就是沿着作用域链来查找的
  2. 查找一个变量的查找规则
    2.1 在当前作用域下的执行上下文中查找对应的属性, 如果有直接返回, 否则进入2.2
    2.2 在上一级作用域的执行上下文中查找对应的属性, 如果有直接返回, 否则进入2.3
    2.3 再次执行2的相同操作, 直到全局作用域, 如果还找不到就抛出找不到的异常
 var a = 2;
  function fn1() {
     
    var b = 3;
    function fn2() {
     
      var c = 4;
      console.log(c);
      console.log(b);
      console.log(a);
      console.log(d);
    }

    fn2();
  }
  fn1();

作用域与执行上下文的区别与联系
  1. 区别1
    1.1 全局作用域之外,每个函数都会创建自己的作用域,作用域在函数定义时就已经确定了。而不是在函数调用时
    1.2 全局执行上下文环境是在全局作用域确定之后, js代码马上执行之前创建
    1.3 函数执行上下文环境是在调用函数时, 函数体代码执行之前创建
  2. 区别2
    2.1 作用域是静态的, 只要函数定义好了就一直存在, 且不会再变化
    2.2上下文环境是动态的, 调用函数时创建, 函数调用结束时上下文环境就会被释放
  3. 联系
    3.1 上下文环境(对象)是从属于所在的作用域
    3.2 全局上下文环境==>全局作用域
    3.3 函数上下文环境==>对应的函数使用域

五 闭包的两大作用 保存/保护

如何产生闭包:
  • 当一个嵌套的内部(子)函数引用了嵌套的外部(父)函数的变量(函数)时, 就产生了闭包
    理解一: 闭包是嵌套的内部函数(绝大部分人)
    理解二: 包含被引用变量(函数)的对象(极少数人)
    注意: 闭包存在于嵌套的内部函数中

    产生闭包的条件? 函数嵌套 内部函数引用了外部函数的数据(变量/函数)
 function fn1 () {
     
    var a = 3
    function fn2 () {
     
      console.log(a)
    }
  }
  fn1()
闭包的作用:
  • 使用函数内部的变量在函数执行完后, 仍然存活在内存中(延长了局部变量的生命周期)
  • 让函数外部可以操作(读写)到函数内部的数据(变量/函数)
 function fun1() {
     
    var a = 3;

    function fun2() {
     
      a++;            //引用外部函数的变量--->产生闭包
      console.log(a);
    }

    return fun2;
  }
  var f = fun1();  //由于f引用着内部的函数-->内部函数以及闭包都没有成为垃圾对象

  f();   //间接操作了函数内部的局部变量
  f();
闭包的生命周期:
  • 产生: 在嵌套内部函数定义执行完时就产生了(不是在调用)
  • 死亡: 在嵌套的内部函数成为垃圾对象时
function fun1() {
     
    //此处闭包已经产生
    var a = 3;
    function fun2() {
     
      a++;
      console.log(a);
    }
    return fun2;
  }
  var f = fun1();
  f();
  f();
  f = null //此时闭包对象死亡

注意:需要手动销毁闭包函数

from 珠峰和尚硅谷课程学习总结 持续更新中

你可能感兴趣的:(前端,javascript)