JavaScript原生知识点系统化描述

JavaScript 作为一门动态、弱类型的编程语言，其原生知识点覆盖了语法、数据类型、执行机制等核心内容。以下是对 JavaScript 原生知识点的系统化描述：

一、基础语法

1. 变量与作用域

   • var：函数作用域，存在变量提升（变量声明被提升到作用域顶部）。
   • let/const：块级作用域，无变量提升，const 声明常量（不可重新赋值）。
   • 作用域链：函数嵌套时，内部函数可访问外部作用域的变量。

2. 数据类型

   • 原始类型：undefined、null、boolean、number、string、Symbol（ES6）、BigInt（ES2020）。
   • 对象类型：Object（包括 Array、Function、Date 等）。
   • 类型检测：typeof（无法区分对象与数组）、instanceof（检测原型链）、Object.prototype.toString.call()。

3. 运算符

   • 严格相等（===）与宽松相等（==），逻辑运算符短路特性（如 || 返回第一个真值）。
   • 解构赋值（ES6）：const { a, b } = obj;，支持数组和对象。

二、流程控制

1. 条件语句
   • if...else、switch（使用全等比较）。
2. 循环
   • for、while、do...while，for...of（遍历可迭代对象），for...in（遍历对象属性，含原型链）。
   • break/continue 控制循环流程。

三、函数

1. 定义方式
   • 函数声明（存在提升）、函数表达式、箭头函数（无 this 绑定）。
2. 参数与返回值
   • 参数默认值（ES6）：function(a = 1) {}。
   • arguments 对象（类数组，箭头函数不可用），剩余参数（...args）。
3. 作用域与闭包
   • 词法作用域：函数定义时确定作用域链。
   • 闭包：函数保留其外部作用域变量的引用，常用于模块化、私有变量。
4. this 绑定
   • 动态绑定规则：默认指向调用者，可通过 call()/apply()/bind() 修改。
   • 箭头函数的 this 由外层作用域决定。

四、对象与原型

1. 对象创建
   • 字面量 {}、构造函数 new Object()、Object.create()。
   • 属性访问：点符号（obj.a）或方括号（obj['a']）。
2. 原型链
   • 每个对象拥有 __proto__ 指向原型对象，构造函数通过 prototype 定义共享方法。
   • 继承机制：通过原型链实现，instanceof 检测原型链关系。
3. ES6 Class
   • 语法糖：class 关键字定义类，extends 实现继承，super() 调用父类构造函数。

五、数组与迭代

1. 数组方法
   • 修改原数组：push()、pop()、splice()。
   • 返回新数组：map()、filter()、slice()。
   • 遍历方法：forEach()、reduce()（累加器）。
2. 迭代器协议
   • Symbol.iterator 定义可迭代对象（如数组、字符串），支持 for...of 遍历。

六、异步编程

1. 回调函数
   • 异步操作完成后执行的函数，存在“回调地狱”问题。
2. Promise
   • 三种状态：pending、fulfilled、rejected。
   • 链式调用：.then().catch().finally()。
3. Async/Await
   • 语法糖：用同步写法处理异步，async 函数返回 Promise，await 暂停执行直到 Promise 完成。
4. 事件循环（Event Loop）
   • 调用栈、任务队列（宏任务：setTimeout，微任务：Promise.then()），微任务优先执行。

七、错误处理

1. try...catch
   • 捕获同步错误，finally 无论是否出错都会执行。
2. throw
   • 抛出自定义错误（Error 对象）。
3. 全局错误处理
   • window.onerror（浏览器）、process.on('uncaughtException')（Node.js）。

八、模块化

1. ES6 Module
   • export 导出模块，import 导入模块，支持静态分析。
   • 默认导出（export default）与命名导出（export const a = 1;）。
2. 动态导入
   • import() 返回 Promise，按需加载模块。

九、BOM 与 DOM

1. BOM（浏览器对象模型）
   • window 对象：location（URL）、navigator（浏览器信息）、localStorage（持久化存储）。
2. DOM（文档对象模型）
   • 节点操作：document.getElementById()、querySelector()。
   • 事件处理：addEventListener()、事件冒泡与捕获、事件委托。
   • 动态修改：createElement()、appendChild()、innerHTML（需防 XSS 攻击）。

十、其他核心特性

1. JSON
   • JSON.stringify() 序列化对象，JSON.parse() 反序列化。
2. 正则表达式
   • RegExp 对象，test() 和 exec() 方法。
3. Date 对象
   • 时间处理：new Date()、时间戳 getTime()。
4. 严格模式
   • 'use strict' 禁止隐式全局变量、重复参数等不安全操作。

十一、ES6+ 新增特性

1. 模板字符串
   • 反引号包裹，支持换行和插值（${variable}）。
2. 解构与扩展运算符
   • 对象合并：const newObj = { ...obj1, ...obj2 };。
3. Proxy 与 Reflect
   • 代理对象拦截操作（如属性读取、赋值），Reflect 提供反射方法。
4. Set 与 Map
   • Set 存储唯一值，Map 键值对集合（键可为任意类型）。

总结

JavaScript 的核心知识点围绕其动态特性、原型继承、异步模型展开，同时随着 ES6+ 的演进，语言功能不断丰富。开发者需深入理解作用域、闭包、事件循环等机制，并掌握现代语法（如模块化、Promise）以应对复杂场景。学习过程中应结合实践，通过调试与性能分析深化对语言特性的理解。