深入理解JS|青训营笔记

JS的基本概念

诞生： 1995年，Brendan Eich开发

1. 借鉴C语言的基本语法
2. 借鉴Java语言的数据类型和内存管理
3. 借鉴Scheme语言，将函数提升到“第一等公民”（first class）的地位
4. 借鉴self语言，使用基于原型（prototype）的继承机制

发展：

1. Mocha->1995.9 LiveScript->1995.12 JavaScript
2. 1997年6月，第一版ECMAScript发布
3. 1999年12月，第三版ECMAScript发布
4. 2009年12月，第五版ECMAScript发布
5. 2009年，Ryan创建了Node.js
6. 2010年，Isaac基于node.js写出了npm
7. 2015年6月，第六版ECMAScript发布

• 单线程
• 动态、弱类型
• 面向对象、函数式
• 解释类语言、JIT
• 安全、性能差
• ......

数据类型

对象：
数组、函数、...
基础类型：
字符串、undefined、数字、null、symbol、bigInt、布尔

作用域

变量的可访问性和可见性

静态作用域，通过它就能够预测代码在执行过程中如何查找标识符

全局作用域：

var company = "Bytedance";

function showCompany(){
    console.log(company);
}

showCompany()

函数作用域：

var company = "Bytedance";

function showCompany(){
    company = "douyin";
    console.log(company);
}

showCompany()

块级作用域：

{
    const company = "Bytedance";
    console.log(1,company);
}
console.log(2,company);

变量提升

console.log('company',company);
console.log('dep',dep);
console.log('myname',myname);
showInfo();
show();

const company = "Bytedance";
let dep = "边缘云";
var myname = "zhangqi";

function showInfo(){
    console.log(company,dep,myname);
    console.log(myname);
}

var show = function(){
    console.log(myname);
}    
 

• var有变量提升
• let、const没有变量提升，提升访问会报错
• function函数可以先调用再定义
• 赋值给变量的函数无法提前调用

JS是怎么执行的

当JS引擎解析到可执行代码片段（通常是函数调用）的时候，就会先做一些执行前的准备工作，这个准备工作，就叫做“执行上下文（execution context 简称EC）”也叫执行环境

• 全局执行上下文：代码开始执行时就会创建，将他压执行栈的栈底，每个生命周期内只有一份

• 函数执行上下文：当执行一个函数时，这个函数内的代码会被编译，生成变量环境、词法环境等，当函数执行结束的时候该执行环境从栈顶弹出

• 词法环境：基于ECMAScript代码的词法嵌套结构来定义标识符和具体变量和函数的关联。一个词法环境记录器和一个可能的引用外部词法环境的空值组成

• 变量环境：变量环境和词法环境的一个不同是前者被用来存储函数声明和变量（let和const）绑定，而后者只能用来存储var变量绑定

• Outer：指向外部变量环境的一个指针

JS的进阶知识点

闭包

function showName(){
    const company = "Bytedance";
    const dep = "边缘云";
    const name = "zhangqi";
    console.log('conpany',company);
    retuen function(){
        console.log(dep);
        retuen name
    }
}

const getName = showName();
console.log(getName());

this

function showName(){
    console.log(this)
}
const personObj = {
    name:'zhangqi',
    dep:'边缘云',
    showName(){
        console.log(this.name)
    },
}
personObj.showName()
const getName = personObj.showName
getName()

垃圾回收