YianNotes

深入理解对象、函数、[[Prototype]]、prototype、constructor 与属性查找机制 一、核心概念速览 概念 类型 所有者 作用 [[Prototype]] 内部槽（Internal Slot） 所有对象（除 null） 指向原型，用于属性查找 prototype 属性（Property） 函数对象（可构造函数） 作为实例的“模板”对象 constructor 属性（Property） prototype 对象默认属性 指向构造函数本身 原型链 机制 —— 通过 [[Prototype]] 链式查找属性 二、[[Prototype]]：对象的“原型指针”✅ 是什么？ 每个对象（除 null）都有一个内部属性 [[Prototype]] 它是一个指针，指向该对象的“原型”（另一个对象或 null） 它是实现继承和属性查找的核心 ✅ 如何访问？ 推荐：Object.getPrototypeOf(obj) 不推荐：obj.__proto__（已废弃，仅用于调试） 12const obj = {};Objec...

一、事件流模型1. 事件流简介事件流描述 DOM 事件 在 DOM 树中传播的完整过程，包含三个阶段： 2. 事件流的三大阶段（1）捕获阶段（Capturing Phase） 事件从 window 向 目标元素 传播 从最外层祖先元素向内传播，直到目标元素 通过 addEventListener 的第三个参数为 true 启用 （2）目标阶段（Target Phase） 事件到达实际触发事件的元素 执行目标元素上绑定的所有事件监听器 此阶段不分捕获和冒泡，按添加顺序执行 （3）冒泡阶段（Bubbling Phase） 事件从 目标元素 向 window 传播 从目标元素向外传播到最外层祖先元素 默认阶段，大多数事件在此阶段触发 3. 完整事件流顺序1234567891011用户交互触发事件 ↓创建事件对象（包含所有事件信息） ↓捕获阶段：window → document → body → 父元素 → 目标元素 ↓（依次执行每个元素上的捕获回调）目标阶段：在目标元素上执行所有监听器 ↓（按添加顺序执行，不分捕获/冒泡）冒泡阶段：目标元素 → 父元素 ...

一、执行上下文（Execution Context）JavaScript 执行代码时，会为每一段可执行代码创建一个 执行上下文，它是代码运行的“环境”。 三种类型 全局执行上下文：脚本启动时创建，全局作用域。 函数执行上下文：每次调用函数时创建。 eval 执行上下文：eval 中执行代码时创建（不常用）。 执行上下文的结构每个执行上下文在运行时包含三个核心部分： 组件 说明 LexicalEnvironment 当前上下文的词法环境（管理 let/const） VariableEnvironment 当前上下文的变量环境（管理 var/函数声明） ThisBinding this 的值 ✅ 简记：执行上下文 = 词法环境 + 变量环境 + this 二、词法环境 vs 变量环境 名称 负责 特点 LexicalEnvironment let、const 有块级作用域，有“暂时性死区”（TDZ） VariableEnvironment var、函数声明 有变量提升，无块级作用域 ⚠️ 注意：函数开始...

迭代是什么迭代是指遍历一个集合（如数组、对象、集合等）的所有元素，通常是按照某种顺序访问。迭代器（Iterator）就是提供这种遍历功能的对象。 迭代器 迭代器（Iterator）是一种 ​ 对象​​，它提供了一种标准的方式来 ​ 按顺序访问集合中的元素 ​​。迭代器的核心是它实现了 next()方法，每次调用 next()会返回当前元素并移动指针到下一个位置。 迭代器协议规定:要成为一种迭代器，必须满足迭代器对象有一个 next 方法，next 方法返回一个对象，这个对象包含两个属性，value：当前迭代的值（可以是任意类型）和 done：布尔值，表示迭代是否完成。 其实还有 return()方法和 throw() 用来提前结束或者抛出错误 可迭代对象实现了【Symbol.iterator】 方法的对象 ​，这个方法返回一个迭代器对象。可迭代对象可以用 for...of 遍历，或通过 ... 展开 示例： 1234567891011121314151617181920// 让一个普通对象变为可迭代对象const myIterableObject = { dat...

生成器基础生成器返回一个迭代器对象 或者说是一个带迭代器的集合 也就是可迭代的对象 123456function* generator() { const a = yield 1; // 暂停，返回 {value: 1, done: false} return a; // 结束，返回 {value: a, done: true}}const gen = generator(); // 返回生成器对象（可迭代对象） 1. next() 方法传参机制（重点补充）核心规则：next(value) 的参数会成为上一个 yield 表达式的返回值 123456789101112131415161718192021function* demo() { console.log("开始"); const step1 = yield "第一步"; // next() 停在这里 console.log("step1:", step1); // step1: 外...