myfreax

JavaScript 教程

欢迎阅读我们的 JavaScript 教程可帮助你快速有效地从头开始学习 JavaScript 编程语言

JavaScript 教程
JavaScript 教程

欢迎阅读我们的 JavaScript 教程可帮助你快速有效地从头开始学习 JavaScript 编程语言。

如果你不确定从哪里开始学习 JavaScript,或者在没有真正理解的情况下复制粘贴他人的 JavaScript 代码,难以理解可以回顾一下我们的教程。

本教程虽然章节很多,但你可不必全部理解才开始编写真实的应用,但你必须看完教程的入门章节。

如何阅读教程

在我们的经验的看来,你只需要知道的是使用 Web 浏览器控制台运行,调试代码。第 2 节的基础知识,大概了解第 3 节运算符

了解第 4 节所有控制流语句。第 5 节的函数,仅仅是函数部分也可以,其它可以后面编写实际应用时深入理解。

然后是第 6 节的对象,函数与对象都可用于组织你的代码。但你必须知道如何创建对象,在对象定义函数。访问对象属性,调用对象的方法。

当完成理解这些基础知识之后,你就可以调用浏览器提供的 API。 例如我们站点使用的 DOM API,Service Worker 等创建可离线的 PWA 应用。

其它章节在你的真实编程生涯中会慢慢出现,在遇到时,可以回顾一下。但现在你必须知道有这个概念的存在。

入门

第 2 节基础知识

  • 语法 —— 解释 JavaScript 语法,包括空格、语句、标识符、关键字、表达式和注释。
  • 变量 —— 向您展示如何声明变量。
  • 数据类型 —— 向您介绍 JavaScript 数据类型,包括原始类型和引用类型。
  • Number 数值 —— 了解 JavaScript 如何使用 Number 类型来表示整数和浮点数。
  • 八进制与二进制字面量 —— 提供对二进制字面量的支持并改变八进制字面量的表示方式。
  • Boolean 布尔 —— 向您介绍 Boolean 布尔类型。
  • String 字符串 —— 了解字符串原始类型和一些基本的字符串操作。
  • Object 对象 —— 向您介绍对象类型。
  • Array 数组 —— 向您介绍 Array 数组类型以及如何操作数组元素。
  • 原始值与引用值 —— 理解 JavaScript 中的两种值类型,包括原始值和引用值,以及它们之间的区别。
  • 数字分隔符 —— 向您展示如何通过使用下划线作为数字分隔符来使数字更具可读性。

第 3 节运算符

  • 算术运算符 —— 向您介绍算术运算符,包括加法 +、减法 -、乘法 * 和除法 /
  • 余数运算符 —— 向您展示如何使用余数运算符  % ,获得一个值除以另一个值时余数。
  • 赋值运算符 —— 指导您如何使用赋值运算符 = 将值或表达式赋给变量。
  • 一元运算符 —— 学习如何使用一元运算符。
  • 比较运算符 —— 向您展示如何使用比较运算符来比较两个值。
  • 逻辑运算符 —— 学习如何使用逻辑运算符:NOT  !、AND  && 和 OR  ||
  • 逻辑赋值运算符 —— 向您介绍逻辑赋值运算符,包括||=, &&=, 和 ??=
  • Nullish 合并运算符 ??  —— 接受两个值并在第一个值是 null 时返回第二个值或者 undefined。
  • 求幂运算符 —— 介绍求幂运算符 **,它计算一个基数的指数次方,类似于Math.pow() 函数。

第 4 节流控制语句

  • if —— 向您展示如何在 if 条件为 true 时运行指定语句。
  • if…else —— 学习如何根据指定条件运行指定语句。
  • if…else…if  —— 检查多个条件并执行一个块。
  • 三元运算符 —— 向您展示如何为 if 语句创建快捷方式 ?:
  • switch —— 向您展示如何使用 switch 语句将一个值与多个变体进行比较时,替换多个 if 语句。
  • while —— 了解如何执行预测试循环,只要指定条件为 true,循环就会重复执行一段代码。
  • do…while —— 向您展示如何在测试条件为 true 后,循环执行重复运行的代码,直到指定条件为false.
  • for 循环 —— 学习如何根据各种选项重复执行一段代码。
  • break —— 了解如何提前终止循环。
  • continue —— 向您展示如何跳过循环的当前迭代并跳转到下一个循环。
  • 逗号运算符 —— 指导您如何在 for 循环中使用逗号运算符一次更新多个变量。

第 5 节函数 Function

  • 函数 —— 向您介绍 JavaScript 函数。
  • 函数是一等公民 —— 学习如何将函数存储在变量,将函数作为参数传递给其他函数,以及将函数作为值返回。
  • 匿名函数 —— 了解匿名函数,也就是没有名称的函数。
  • 按值传递 —— 了解按值传递在 JavaScript 工作原理。
  • 递归函数 —— 学习如何定义递归函数。
  • 默认参数 —— 向您展示如何为函数定义默认参数。

第 6 节对象和原型

  • 对象方法 —— 向您介绍对象的方法。
  • 构造函数 —— 向您展示如何使用构造函数在 JavaScript 定义自定义类型。
  • prototype 原型 —— 了解原型在 JavaScript 的工作原理。
  • 构造函数/原型模式 —— 向您展示如何结合构造函数和原型模式来定义自定义类型。
  • 原型继承 —— 理解 JavaScript 的原型继承。
  • This 是什么 —— 了解 this 它的作用及 this 在 JavaScript 工作方式。
  • globalThis  —— 提供一种跨环境访问全局对象的标准方法。
  • 对象属性 —— 深入了解对象的属性及其属性。
  • for…in 循环 —— 学习如何使用 for...in 循环迭代对象的属性。
  • 可枚举属性 —— 了解更多关于可枚举属性的信息。
  • Own Properties —— 了解对象自己的属性和继承的属性。
  • Object.values() —— 函数返回对象自身的可枚举属性值作为数组。
  • Object.entries() —— 函数返回对象自身可枚举属性的键值对 [key, value]
  • Object.assign() —— 函数复制对象或合并对象。
  • Object.is() – 检查两个值是否相同。
  • Factory Function 工厂函数 —— 了解工厂函数,它们是返回对象的函数。
  • 对象解构 —— 学习如何将对象的属性分配给变量。
  • 可选链接运算符 ?. —— 在不检查对象链中的每个引用是否为 null 或者 undefined时,访问位于对象链深处属性。
  • 对象字面量扩展 —— 提供了一种定义对象字面量的新方法。

第 7 节 Class 类

  • Class 类 —— 向您介绍 ES6 类语法以及如何声明类。
  • Getters 和 Setters —— 使用 get 和 set 关键字为类定义 getters 和 setters。
  • 类表达式 —— 学习另一种使用类表达式定义类的方法。
  • 计算属性 —— 解释计算属性及其实际应用。
  • 继承 —— 向您展示如何使用关键词 extends 和 super 扩展类。
  • new.target —— 向您介绍元属性 new.target
  • 静态方法 —— 指导您如何定义与类关联的方法,在不实例化类情况调用类的方法。
  • 静态属性 —— 向您展示如何定义一个类的所有实例共享的静态属性。
  • 私有字段 —— 了解如何在类中定义私有字段。
  • 私有方法 —— 向您展示如何在类中定义私有方法。

第 8 节函数进阶

  • 函数类型 —— 向您介绍 Function 类型及其属性和方法。
  • call() —— 了解 call() 方法并学习如何有效地使用它。
  • apply() —— 学习如何有效地使用 apply() 方法。
  • bind() —— 了解bind()方法以及如何有效地应用它。
  • 闭包 —— 理解 JavaScript 闭包。
  • 函数表达式 IIFE —— 了解立即调用函数表达式 IIFE 。
  • 返回多个值 —— 指导您如何从一个函数返回多个值。
  • 箭头函数 —— 向您介绍箭头函数 =>
  • 什么时候不应该使用箭头函数 —— 学习什么时候不应该使用箭头函数。
  • Rest 参数 —— 向您介绍 Rest 参数以及如何有效地使用它。
  • 回调函数 —— 向您介绍回调函数并学习如何使用回调来处理异步操作。

第 9 节 Promises 和 Async/Await

  • Promises —— 了解 Javascript Promises,Promises 是什么,以及如何有效地使用Promises。
  • Promise chaining —— 向您展示如何按顺序执行多个异步操作。
  • Promise.all()  —— 学习如何组合多个 promise 进行并行运行
  • Promise.race() —— 学习如何组合多个 promise 进行并行运行。
  • Promise.any() —— 了解如何使用 JavaScript Promise.any() 方法返回第一个满足条件的 Promise
  • Promise.allSettled() —— 接受 Promises 数组并返回一个新 Promise,并将 Promises 解析为一组值,这些值由 Promises 的值决定,可以是 Resolve,Reject。
  • Promise.prototype.finally() —— 当 Promise 完成时执行一段代码,不管 Promise 是Resolve 还是 Reject。
  • Promise 错误处理 —— 指导您如何处理 promise 中的错误。
  • Async / Await —— 用同步的语法编写异步运行的代码。

第 10 节迭代器和生成器

  • 迭代器 Iterator—— 向您介绍迭代和迭代器原型。
  • 生成器 Generators —— 可以在挂起或者暂停后,继续从暂停处运行的函数。
  • yield —— 深入了解如何在生成器使用关键词 yield
  • for…of —— 学习如何使用 for...of 循环来遍历可迭代对象的元素。
  • 异步迭代器 —— 了解如何使用异步迭代器顺序访问异步数据源。
  • 异步生成器 —— 向您展示如何创建异步生成器。

第 11 节模块

  • ES6 模块 —— 学习如何编写模块化的 JavaScript 代码。
  • 动态导入 —— 向您展示如何通过 import() 函数动态导入模块。
  • 顶级 Await —— 解释顶级 Await 模块及其用例。

第 12 节 symbol 符号

  • Symbol —— 向您介绍一种在 ES6 原始类型 symbol

第 13 节 Map 与 Set

  • Map  —— 向您介绍集合类型 Map 保存键值对。
  • Set —— 了解如何使用集合的类型 Set 保存唯一值。

第 14 节错误处理

第 15 节 var、let 和 const

  • let —— 使用 let 关键词声明块作用域的变量。
  • let 与 var —— 理解 letvar 之间的区别。
  • const —— 使用 const 关键词定义常量。

第 16 节代理和反射

  • 代理 —— 学习如何使用Proxy 对象封装另一个对象(目标)并拦截目标对象的基本操作。
  • 反射 —— 向您展示如何使用 ES6 反射 API 在运行时操作对象的变量、属性和方法。

第 17 节 JavaScript 运行时

  • 执行上下文 —— 了解执行上下文,包括全局和函数执行上下文。
  • 调用堆栈 —— 了解调用堆栈。
  • 事件循环 —— 向您展示 JavaScript 如何使用事件循环处理异步操作。
  • 变量提升 —— 了解变量提升在 JavaScript 工作原理。
  • 变量作用域 —— 向您介绍变量作用域。

第 18 节原始类型

  • 原始类型 —— 了解原始类型在 JavaScript 是如何工作。
  • Boolean —— 向您介绍 Boolean 原始类型。
  • Number —— 了解 Number 原始类型。
  • BigInt —— 向您介绍 BigInt 表示巨大整数的类型。

内容导航