JavaScript 是一个庞大的主题，有如此多的不同特性、风格和技术需要学习，还有在此之上构建的众多 API 和工具。本模块主要关注核心语言的要点，以及一些关键的周边主题——学习这些主题将为你打下坚实的基础。
通用资源
-
学习 JavaScript，Scrimba 课程合作伙伴
6. JavaScript 基础
脚本
核心模块
6.1 变量
学习成果
-
理解变量是什么，以及它们在编程（不仅是 JavaScript）中的重要性。
-
使用
let声明变量并为其赋值。 -
使用新值重新赋值变量。
-
使用
const创建常量。 -
变量和常量之间的区别，以及何时使用它们。
-
理解变量命名的最佳实践。如果未明确涵盖，所有示例都应展示良好的变量命名实践。
-
可以存储在变量中的不同类型的值——字符串、数字、布尔值、数组和对象。
资源
6.2 数学运算
学习成果
-
JavaScript 中的基本数字运算——加、减、乘、除。
-
理解如果数字被定义为字符串，它们就不是数字，这可能导致计算出错。
-
使用
Number()将字符串转换为数字。 -
运算符优先级。
-
自增和自减。
-
赋值运算符，例如加法赋值和减法赋值。
-
比较运算符。
-
基本的
Math对象方法，例如Math.random()、Math.floor()和Math.ceil()。
资源
6.3 文本（字符串）
学习成果
-
创建字符串字面量。
-
理解匹配引号的必要性。
-
字符串拼接。
-
在字符串中转义字符。
-
模板字面量
-
在模板字面量中使用变量。
-
多行模板字面量。
-
-
使用常用属性和方法进行字符串操作，例如
-
length. -
toString(). -
includes(). -
indexOf(). -
slice(). -
toLowerCase()和toUpperCase()。 -
replace().
-
资源
6.4 数组
6.5 条件语句
学习成果
-
理解条件语句是什么——一种根据测试结果运行不同代码路径的代码结构。
-
if ... else ... else if. -
使用比较运算符创建测试。
-
AND、OR 和 NOT 在测试中的应用。
-
Switch 语句。
-
三元运算符。
资源
6.6 循环
学习成果
-
理解循环的目的——一种代码结构，允许你多次执行相似的操作，而无需为每次迭代重复相同的代码。
-
基本
for循环。 -
使用
for ... of遍历集合。
注意:
JavaScript 中还有许多其他类型的循环，我们未在此列出。在这个阶段，没有必要（也无益）理解所有这些循环。目前，学生需要理解循环的目的以及最常见的类型。
break和continue。
资源
6.7 函数
学习成果
-
理解函数的作用——实现可重用代码块的创建，可以在需要的地方调用。
-
理解函数在 JavaScript 中无处不在，其中一些是浏览器内置的，一些是用户定义的。
-
理解函数和方法之间的区别。
-
调用函数。
-
返回值。
-
理解全局作用域和函数/块作用域。
-
在函数调用中传递参数。
-
命名函数和匿名函数。
-
构建自己的自定义函数
-
包含参数。
-
包含返回值。
-
-
回调函数——理解函数参数本身可以是函数，以及这种模式的用途。
-
箭头函数。
资源
-
使用函数编写更少的代码，Scrimba 课程合作伙伴
6.8 JavaScript 对象基础
学习成果
-
理解在 JavaScript 中，大多数东西都是对象，而且你每次接触 JavaScript 时可能都使用过对象。
-
基本语法
-
对象字面量。
-
属性和方法。
-
在对象中嵌套对象和数组。
-
-
使用构造函数创建新对象。
-
对象作用域和
this。 -
访问属性和方法——括号和点语法。
-
对象解构。
资源
6.9 DOM 脚本
学习成果
-
理解 DOM 是什么——浏览器对文档 HTML 结构的内部表示，以对象层次结构的形式存在，可以使用 JavaScript 进行操作。
-
理解 Web 浏览器中的重要部分以及它们在 JavaScript 中的表示——
Navigator、Window和Document。 -
理解 DOM 节点在 DOM 树中如何相互关联——根节点、父节点、子节点、同级节点和后代节点。
-
获取 DOM 节点的引用，例如使用
querySelector()和getElementById()。 -
创建新节点，例如使用
innerHTML()和createElement()。 -
使用
appendChild()和removeChild()将节点添加到 DOM 或从中移除。 -
使用
setAttribute()添加属性。 -
使用
Element.style.*和Element.classList.*操作样式。
资源
6.10 事件
学习成果
-
理解事件是什么——浏览器在发生重要事件时发出的信号，开发者可以编写代码来响应。
-
事件处理器
-
addEventListener()和removeEventListener() -
事件处理程序属性。
-
内联事件处理程序属性，以及为什么你不应该使用它们。
-
-
事件对象。
-
使用
preventDefault()阻止默认行为。 -
事件委托。
资源
6.11 异步 JavaScript 基础
学习成果
-
理解异步 JavaScript 的概念——它是什么以及它与同步 JavaScript 的区别。
-
理解回调函数和事件在历史上一直是在 JavaScript 中进行异步编程的方式。
-
使用 async 函数和
await进行现代异步编程-
基本用法。
-
理解 async 函数的返回值。
-
使用
try ... catch进行错误处理。
-
-
Promises
-
理解
async/await底层使用 Promise；它们提供了一个更简单的抽象。 -
Promise 链式调用。
-
使用
catch()捕获错误。
-
资源
6.12 使用 fetch() 进行网络请求
学习成果
-
理解
fetch()用于异步网络请求，这是 Web 上最常见的异步 JavaScript 用例。 -
从网络获取的常见资源类型
-
文本内容、JSON、媒体资源等。
-
来自 RESTful API 的数据。了解 REST 的基本概念，包括常见的模式，如 CRUD。
-
-
理解单页应用 (SPA) 是什么，以及与之相关的问题
-
异步更新后面的可访问性问题，例如，屏幕阅读器默认情况下不会宣布内容更新。
-
异步更新后面的可用性问题，如历史记录丢失和后退按钮失效。
-
-
理解 HTTP 基础。你应该了解常见的 HTTP 方法，如
GET、DELETE、POST和PUT，以及它们如何通过fetch()进行处理。
资源
6.13 使用 JSON
6.14 库和框架
学习成果
-
理解第三方代码是什么——由他人编写的功能，你可以在自己的项目中使用，这样你就无需自己编写所有内容。
-
为什么开发者使用第三方代码
-
效率和生产力：大量复杂的功能已经为你写好，并且以一种强制高效、模块化代码组织的方式创建。
-
兼容性：信誉良好的框架代码已经过优化，可以跨浏览器/设备工作，以获得最佳性能等。许多框架还具有输出到特定平台（例如 Android 或 iOS）作为构建目标的系统。
-
支持/生态系统：流行的框架拥有活跃的社区和帮助资源来提供支持，以及丰富的扩展/插件系统来添加功能。
-
-
库和框架的区别
-
为什么应该使用框架？
-
它们可以提供大量功能并为你节省大量时间。
-
许多公司使用 React 或 Angular 等流行框架来编写他们的应用程序，因此许多工作将框架列为对申请人的要求。
-
-
为什么框架不总是正确的选择？框架
-
对于小型项目来说可能很容易过度——你可能最好编写几行原生 JavaScript 来解决问题，或者使用定制的库。
-
通常会为你的应用程序的初始下载添加大量 JavaScript，导致初始性能下降和潜在的可用性问题。
-
通常附带自己的一套自定义语法和约定，这可能会给项目带来巨大的额外学习曲线。
-
可能由于其架构选择而与现有代码库不兼容。
-
需要定期更新，这可能导致你的应用程序需要额外的维护开销。
-
可能由于其架构（例如，SPA 式客户端路由）而给使用辅助技术的用户带来重大的可访问性问题，需要仔细考虑。
-
-
如何选择？一个好的库或框架必须
-
解决你的问题，同时提供远远超过其带来的任何负面影响的优势。
-
拥有良好的支持和友好的社区。
-
积极维护——不要选择一个一年以上未更新或没有用户的代码库。
-
资源
6.15 JavaScript 调试
学习成果
-
理解不同类型的 JavaScript 错误，例如语法错误和逻辑错误。
-
了解常见的 JavaScript 错误消息类型及其含义。
-
使用浏览器开发者工具检查你页面上运行的 JavaScript，并查看它产生的错误。
-
使用
console.log()和console.error()进行简单的调试。 -
错误处理
-
使用条件语句避免错误。
-
try ... catch. -
throw.
-
-
使用断点、监视器等进行高级 JavaScript 调试。
资源
-
Firefox JavaScript 调试器，Firefox Source Docs
-
Chrome > Console 概览，developer.chrome.com (2019)
-
Chrome > Debug JavaScript，developer.chrome.com (2017)