现代 JavaScript 教程 学js的网站

网址https://zh.javascript.info/

 

 

现代 JavaScript 教程

以最新的 JavaScript 标准为基准。通过简单但足够详细的内容，为你讲解从基础到高阶的 JavaScript 相关知识。

搜索

最后修改在 2022年6月15日

购买EPUB/PDF

分享:

6702 ★githubWeChat 和 QQ

目录

课程的核心内容包含 2 部分，涵盖了 JavaScript 编程语言相关知识和浏览器行为。此外还有一系列的专题文章。

第 一 部分JavaScript 编程语言第 二 部分浏览器：文档，事件，接口第 三 部分其他文章

JavaScript 编程语言

在这儿我们将从头开始学习 JavaScript，也会学习 OOP 等相关高级概念。

本教程专注于语言本身，我们默认使用最小环境。

简介

• JavaScript 简介
• 手册与规范
• 代码编辑器
• 开发者控制台

JavaScript 基础知识

• Hello, world!
• 代码结构
• 现代模式，"use strict"
• 变量
• 数据类型
• 交互：alert、prompt 和 confirm
• 类型转换
• 基础运算符，数学
• 值的比较
• 条件分支：if 和 '?'
• 逻辑运算符
• 空值合并运算符 '??'
• 循环：while 和 for
• "switch" 语句
• 函数
• 函数表达式
• 箭头函数，基础知识
• JavaScript 特性

代码质量

• 在浏览器中调试
• 代码风格
• 注释
• 忍者代码
• 使用 Mocha 进行自动化测试
• Polyfill 和转译器

Object（对象）：基础知识

• 对象
• 对象引用和复制
• 垃圾回收
• 对象方法，"this"
• 构造器和操作符 "new"
• 可选链 "?."
• symbol 类型
• 对象 — 原始值转换

数据类型

• 原始类型的方法
• 数字类型
• 字符串
• 数组
• 数组方法
• Iterable object（可迭代对象）
• Map and Set（映射和集合）
• WeakMap and WeakSet（弱映射和弱集合）
• Object.keys，values，entries
• 解构赋值
• 日期和时间
• JSON 方法，toJSON

函数进阶内容

• 递归和堆栈
• Rest 参数与 Spread 语法
• 变量作用域，闭包
• 老旧的 "var"
• 全局对象
• 函数对象，NFE
• "new Function" 语法
• 调度：setTimeout 和 setInterval
• 装饰器模式和转发，call/apply
• 函数绑定
• 深入理解箭头函数

对象属性配置

• 属性标志和属性描述符
• 属性的 getter 和 setter

原型，继承

• 原型继承
• F.prototype
• 原生的原型
• 原型方法，没有 __proto__ 的对象

类

• Class 基本语法
• 类继承
• 静态属性和静态方法
• 私有的和受保护的属性和方法
• 扩展内建类
• 类检查："instanceof"
• Mixin 模式

错误处理

• 错误处理，"try...catch"
• 自定义 Error，扩展 Error

Promise，async/await

• 简介：回调
• Promise
• Promise 链
• 使用 promise 进行错误处理
• Promise API
• Promisification
• 微任务（Microtask）
• Async/await

Generator，高级 iteration

• Generator
• 异步迭代和 generator

模块

• 模块 (Module) 简介
• 导出和导入
• 动态导入

杂项

• Proxy 和 Reflect
• Eval：执行代码字符串
• 柯里化（Currying）
• Reference Type
• BigInt

浏览器：文档，事件，接口

学习如何管理浏览器页面：添加元素，操纵元素的大小和位置，动态创建接口并与访问者互动。

Document

• 浏览器环境，规格
• DOM 树
• 遍历 DOM
• 搜索：getElement*，querySelector*
• 节点属性：type，tag 和 content
• 特性和属性（Attributes and properties）
• 修改文档（document）
• 样式和类
• 元素大小和滚动
• Window 大小和滚动
• 坐标

事件简介

• 浏览器事件简介
• 冒泡和捕获
• 事件委托
• 浏览器默认行为
• 创建自定义事件

UI 事件

• 鼠标事件
• 移动鼠标：mouseover/out，mouseenter/leave
• 鼠标拖放事件
• 指针事件
• 键盘：keydown 和 keyup
• 滚动

表单，控件

• 表单属性和方法
• 聚焦：focus/blur
• 事件：change，input，cut，copy，paste
• 表单：事件和方法提交

加载文档和其他资源

• 页面生命周期：DOMContentLoaded，load，beforeunload，unload
• 脚本：async，defer
• 资源加载：onload，onerror

杂项

• DOM 变动观察器（Mutation observer）
• 选择（Selection）和范围（Range）
• 事件循环：微任务和宏任务

其他文章

教程的前两部分未涉及的其他主题的内容列表。此处没有明确的层次结构，你可以按你需要的顺序阅读文章。

Frame 和 window

• 弹窗和 window 的方法
• 跨窗口通信
• 点击劫持攻击

二进制数据，文件

• ArrayBuffer，二进制数组
• TextDecoder 和 TextEncoder
• Blob
• File 和 FileReader

网络请求

• Fetch
• FormData
• Fetch：下载进度
• Fetch：中止（Abort）
• Fetch：跨源请求
• Fetch API
• URL 对象
• XMLHttpRequest
• 可恢复的文件上传
• 长轮询（Long polling）
• WebSocket
• Server Sent Events

在浏览器中存储数据

• Cookie，document.cookie
• LocalStorage，sessionStorage
• IndexedDB

动画

• 贝塞尔曲线
• CSS 动画
• JavaScript 动画

Web components

• 从星球轨道的高度讲起
• Custom elements
• 影子 DOM（Shadow DOM）
• 模板元素
• Shadow DOM 插槽，组成
• 给 Shadow DOM 添加样式
• Shadow DOM 和事件（events）

正则表达式

• 模式（Patterns）和修饰符（flags）
• 字符类
• Unicode：修饰符 “u” 和 class \p{...}
• 锚点（Anchors)：字符串开始 ^ 和末尾 $
• Flag "m" — 多行模式
• 词边界：\b
• 转义，特殊字符
• 集合和范围 [...]
• 量词 `+,*,?` 和 `{n}`
• 贪婪量词和惰性量词
• 捕获组
• 模式中的反向引用：\N 和 \k<name>
• 选择（OR）|
• 前瞻断言与后瞻断言
• 灾难性回溯
• 粘性标志 "y"，在位置处搜索
• 正则表达式（RegExp）和字符串（String）的方法