深入理解JS | 青训营笔记

56 阅读2分钟

184853948061822851.jpg

课程内容:

1.JS的基本概念

2.JS是怎么执行的

3.JS的进阶知识点

一、JS的基本概念

① 诞生:1995年,Brendan Eich开发

1.借鉴C语言的基本语法。

2.借鉴Java语言的数据类型和内存管理。

3.借鉴Scheme语言,将函数提升到"第一等公民"(firstclass)的地位。

4.借鉴Self语言,使用基于原型(prototype)的继承机制。

② 发展:

1 Mocha 1995.9 LiveScript1995.12 JavaScript

2.1997年6月,第一版ECMAScript发布

3.1999年12月,第三版ECMAScript发布

4.2009年12月,第五版ECMAScript发布

5.2009年,Ryan创建了Nodejs

6.2010年,Isaac基于node.js写出了npm72015年6月,第六版ECMAScript发布

③ 关系图

336957682923809007.jpg

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

696119829673701622.jpg

④ 数据类型

381684848609039160.jpg

⑤ 作用域

变量的可访问和可见性

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

1.全局作用域:

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

2.函数作用域:

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

3.块级作用域:

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

⑥ 变量提升

  • var有变量提升

  • let,const没有提升,提前访问会报错

  • function函数可以先调用再定义

  • 赋值给变量的函数无法提前调用

871118666870658030.jpg

代码块如下:

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);
}

二、JS是怎么执行的

34610551510501288.jpg

212794996705350955.jpg

581400903809078195.jpg

  • 全局执行上下文:代码开始执行时就会创建,每个生命周期内只有一个

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

var scop = 'global';
func();
console.log(company);
function func() {
var funcVar = 'func';
console.log('这是一个函数',funVar);
}
var company = '字节跳动';

442488132503433052.jpg

提问:创建执行上下文的时候做了什么?

答:

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

  • 变量环境:变量环境和词法环境的一个不同就是前者被用来存储函数声明和变量(let和const)绑定 而后者只用来存储var变量绑定。

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

285710276096008089.jpg

722418879920374083.jpg

768426729461276234.jpg

三、JS的进阶知识点

① 闭包

590211605357561405.jpg

② this

439317892820280796.jpg

③ 垃圾回收

527796018181827483.jpg

以上就是本次笔记的所有内容了,感谢大家的阅读~