理解JS | 青训营笔记

28 阅读3分钟

前言

本课程主要面向刚刚入门的前端同学,主要讲述了JS的整体发展及一些比较重要的知识。其中通过一些简单的代码讲述了变量提升、JS的数据是怎么存储的、基础数据类型和复杂数据类型的区别等一些基础知识,也讲解了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发布

image.png

数据类型

JS的数据类型主要从对象基础类型两个方面进行考虑的,其关系如下图所示。

image.png

作用域

变量的可访问性和可见性。

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

变量提升

console.log('company', company );
console.1og('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怎么执行的

image.png

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

image.png

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

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

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

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

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

JS进阶知识点

通常,如果引用闭包的函数是一个全局变量,那么闭包会一直存在直到页面关闭:;但如果这个闭包以后不再使用的话,就会造成内存泄漏。

如果引用闭包的函数是个局部变量,等函数销毁后,在下次JavaScript引擎执行垃圾回收时,判断闭包这块内容如果已经不再被使用了,那么JavaScript引擎的垃圾回收器就会回收这块内存。

image.png

其他

通过这一部分的学习,大致了解了前端JS的一些基础东西,为后续的学习奠定了基础。本次课程还介绍了JS的基本概念、JS的数据类型、变量提升、作用域等,感兴趣的同学可以自行去学习字节内部课程。

( ps:本次学习主打的就是快乐!!!)