-
JS:深入理解JavaScript-原型
在这篇文章里会介绍如下内容: 什么是原型和原型链 prototype 和__proto__有什么区别 new 和Object.create()创建对象和实现继承的区别原型在JS中每个函数都有一个prototype属性,它实际指向的是一个prototype对象,比如有一个函数Foo,我们来看下Foo.prototype这个对象里到底有什么:function Foo() {}Foo.prototype.name = "mei";console.log(Foo.prototype);输出结...…
-
JS:深入理解JavaScript-闭包
在文章【JS:深入理解JavaScript-执行上下文】中介绍了代码在执行栈是如何运行的,假设有如下代码:function foo() { var a = 2; function bar() { console.log(a); } bar();}foo()引擎在执行这段代码的步骤如下: 1:创建一个新的执行上下文(Execution Context) 2:创建一个新的词法环境(Lexical Environment) 3:把LexicalEnvi...…
-
JS:深入理解JavaScript-this
在上一篇文章【JS:深入理解JavaScript-执行上下文】中介绍了执行上下文是如何工作的。在这篇文章里会介绍执行上下文中的ThisBinding,也就是JavaScript中的this。有四种可执行代码可以创建执行上下文,分别是global code function code module和eval code。接下来分别介绍这global code function code可执行代码中的this(ThisBinding)到底指的是什么。global code的this在JS引擎运行...…
-
JS:深入理解JavaScript-函数
JavaScript中定义函数有这几种方式: 函数声明 函数表达式 立即执行函数 new Funcion(arg1,arg2…,argn,body)创建函数。定义函数的方式不同,它们的词法环境会不一样,作用域链也不一样。函数声明我们来看一个函数声明的例子:var a = 2;function foo() { console.log(a); // 2}function bar() { var a = 3; foo();}bar();在文章【JS:深入理解JavaSc...…
-
JS:深入理解JavaScript-执行上下文
在上一篇文章【JS:深入理解JavaScript-词法环境】详细介绍了词法环境,它是在V8引擎词法分析阶段用来登记变量的,这样在引擎真正执行代码的时候,就知道去哪里拿变量的值。也提到过,每次执行回调函数的时候,会把方法以执行上下文(Execution Context)的方式压入执行栈(Call Stack),执行完以后会被弹出执行栈。比如有代码:var a;function foo() { a = "hi, i am foo"; console.log(a);}function...…
-
JS:深入理解JavaScript-词法环境
在文章【JS:详解Event Loop运行机制,以及microtasks和macrotask的执行顺序】这篇文章中简单介绍了Call Stack(调用栈),在JS中所有代码都是在调用栈中执行的,遵循后进先出的原则。在了解Event Loop和调用栈的运行机制之后,仔细想了一下又觉得很疑惑: 只有function可以被压入调用栈执行吗? JS引擎在执行代码时,是从哪里找到要引用的变量值,函数调用又是怎么找到对应的函数的呢? 图中每个蓝色的方块代表一个function?在调用栈里是什么?...…
-
JS:详解Event Loop运行机制
在这篇文章中会介绍以下内容: engine runtime 和 call stack 简介(以 V8 引擎为例) Event Loop 运行机制的详解 microtasks 和 macrotask 的执行顺序 engine runtime 和 call stack 简介在 chrome 浏览器和 nodejs 里都是用 V8 引擎解析和运行 JS 代码,我们先来看下 V8 引擎的简化图:上图中 Heap 是用来做内存分配,Call Stack是用来执...…
-
JS:展开运算符
展开运算符 (…)展开运算符,是 ES6 中的新语法,是把可迭代的对象(string,object,数组)展开,可以用在函数调用 / 数组构造的时候,将数组表达式 / string 在语法层面展开,还可以将对象表达式按照 key-value 的方式展开。展开运算符只能用于可迭代对象。函数调用:假如你把...放在函数的参数里,就说明这个参数必须是interable object,然后这个对象会被展开成为函数的参数:function func(x, y) { console.log(x); ...…
-
JS:Map 和 Set
MapMap 是 JS(es6) 的一种字典数据结构, key 值不重复,如果有重复,就会覆盖前面的,任何值都可以作为 Map 的 key, 包括对象,字符,数字,NaN,symbol。Map 跟 Object 很像,但是 Object 只能用 string / symbol 作为 Key,Map 可以通过 size 获取键值对个数,而 Object 只能手动计算。在 JS 中,NaN === NaN是false,不过在 Map 里 NaN 被认为是同一个 key:const map = ...…
-
JS:核心基础知识点
Primitive values vs. ObjectsPrimitive values 是指:undefined, null, boolean, number, bigint, string, symbol。除此之外的都是 Objects。 Primitive values 是通过值传递的,两个 Primitive 比较的时候,是比较它们两个的值。 Objects 是通过引用传递,两个 Objects 比较的时候,是比较它们两个的引用。 const a = {}; // f...…