feat:增加前端工程博客

This commit is contained in:
2025-12-13 16:27:56 +08:00
parent 8b2c289833
commit 564799001a
11 changed files with 1721 additions and 12 deletions

View File

@@ -917,7 +917,7 @@ console.log(person1.sayName === person2.sayName)
  所有的属性和方法都直接添加到`Person``prototype`属性上了,使用这种原型模式定义的属性和方法是由所有的实例对象共享的。
#### 深入理解原型
![理解原型](./images/理解原型.png)
![理解原型](../images/理解原型.png)
  `JavaScript`中,只要创建了一个函数,就会按照特定的规则**为这个函数创建一个`prototype`属性**(指向原型对象)。所有的**原型对象自动获得一个名为`constructor`的属性,指回与之关联的构造函数**。
  在自定义构造函数时,原型对象默认只会获得`constructor`属性,其他的所有方法都继承自`Object`(本例中的其他方法是在后面自定义的)。每次调用构造函数会创建一个新实例对象,这个实例对象的内部`[[Prototype]]`指针就会被赋值为构造函数的原型对象(大部分浏览器将这个指针定义为实例对象上的`__proto__`属性)。通过这个属性就可以访问对象的原型。
  因此,实例对象通过`__proto__`可以链接到原型对象,它实际上指向隐藏特性`[[Prototype]]`,构造函数通过`Prototype`属性链接到原型对象。**实例对象与构造函数原型之间有直接的联系,但实例对象与构造函数之间没有关系。**
@@ -1280,7 +1280,7 @@ function compare(value1, value2) {
let result = compare(5, 10)
```
![普通函数作用域链](./images/普通函数作用域链.png)
![普通函数作用域链](../images/普通函数作用域链.png)
  如图所示,`compare()`函数是在全局上下文中调用的,第一次调用时,会为它创建一个包含`arguments``value1``value2`的活动对象,该对象是其作用域链上的第一个对象,而全局上下文的变量对象则是`compare()`作用域链上的第二个对象,包含`this``result``compare`
  全局上下文会在代码执行期间始终存在,而函数局部上下文只在函数执行期间存在。
  在定义`compare()`函数时,会为其创建作用域链,预装载全局变量对象,并保存在内部的`[[Scope]]`中。在调用这个函数时,会创建相应的执行上下文,然后通过复制函数的`[[Scope]]`来创建其作用域链,接着会创建函数的活动对象并将其推入作用域链的前端。
@@ -1307,7 +1307,7 @@ let compare = createComparisonFunction('name')
let result = compare({'name': 'Cxx'}, {'name': 'Pjm'})
```
![闭包函数作用域链](./images/闭包函数作用域链.png)
![闭包函数作用域链](../images/闭包函数作用域链.png)
  **在一个函数内部定义的函数会把其包含函数的活动对象添加到自己的作用域链中。**
  `createComparisonFunction()`返回匿名函数后,其作用域链会被初始化为包含`createComparisonFunction()`的活动对象和全局变量对象,这样匿名函数就可以访问到`createComparisonFunction()`可以访问到的所有变量。
  而当`createComparisonFunction()`执行完毕后,匿名函数仍然有它的引用,其执行上下文的作用域链会销毁,但它的活动对象仍然会保留在内存中,直到匿名函数被销毁后才会被销毁。
@@ -1608,7 +1608,7 @@ setTimeout(() => {
```
  `Promise`一共有3种状态待定`pending`、兑现`fulfilled`(或者称为解决`resolved`)和拒绝`rejected`。无论何时,`Promise`有且只可能是其中一种状态,且不可逆。待定是`Promise`的最初始状态,也是默认状态,当在`Promise`内部调用控制`Promise`状态的函数时,则会进行相应的状态切换,否则一致保持待定状态。
![promise基础](./images/promise基础.png)
![promise基础](../images/promise基础.png)
  `p1`中,立即调用`resolve()`函数将其状态转为解决,而在`p2`通过延迟1秒再将其状态转为拒绝`p3`会一直保持默认状态。
  因此,`p1`的状态会一直保持解决状态,并带有解决的返回值。`p2`的状态一开始为待定1秒后会变成拒绝状态也带有拒绝的返回值并且控制台会提示错误信息。`p3`则会一直处于待定状态,并没有返回值。