现代JavaScript 教程（JavaScript基础知识）总结

目录

变量

JavaScript 中有八种基本的数据类型（译注：前七种为基本数据类型，也称为原始类型，而 object 为复杂数据类型）。

  • number 用于任何类型的数字：整数或浮点数，在 ±(253-1) 范围内的整数。
  • bigint 用于任意长度的整数。
  • string 用于字符串：一个字符串可以包含 0 个或多个字符，所以没有单独的单字符类型。
  • boolean 用于 true 和 false。
  • null 用于未知的值 —— 只有一个 null 值的独立类型。
  • undefined 用于未定义的值 —— 只有一个 undefined 值的独立类型。
  • symbol 用于唯一的标识符。
  • object 用于更复杂的数据结构。

我们可以通过 typeof 运算符查看存储在变量中的数据类型。

  • 两种形式：typeof x 或者 typeof(x)。
  • 以字符串的形式返回类型名称，例如 "string"。
  • typeof null 会返回 "object" —— 这是 JavaScript 编程语言的一个错误，实际上不是一个 object。

交互：alert、prompt、confirm

alert

显示信息。

prompt

显示信息要求用户输入文本。点击确定返回文本，点击取消或按下 Esc 键返回 null。

confirm

显示信息等待用户点击确定或取消。点击确定返回 true，点击取消或按下 Esc 键返回 false。

类型转换

有三种常用的类型转换：转换为 string 类型、转换为 number 类型和转换为 boolean 类型。

字符串转换 —— 转换发生在输出内容的时候，也可以通过 String(value) 进行显式转换。原始类型值的 string 类型转换通常是很明显的。

数字型转换 —— 转换发生在进行算术操作时，也可以通过 Number(value) 进行显式转换。

数字型转换遵循以下规则：

值 变成……
undefined NaN
null 0
true / false 1 / 0
string “按原样读取”字符串，两端的空白会被忽略。空字符串变成 0。转换出错则输出 NaN。

布尔型转换 —— 转换发生在进行逻辑操作时，也可以通过 Boolean(value) 进行显式转换。

布尔型转换遵循以下规则：

值 变成……
0, null, undefined, NaN, "" false
其他值 true

上述的大多数规则都容易理解和记忆。人们通常会犯错误的值得注意的例子有以下几个：

  • 对 undefined 进行数字型转换时，输出结果为 NaN，而非 0。
  • 对 "0" 和只有空格的字符串（比如：" "）进行布尔型转换时，输出结果为 true。

基础运算符，数学

数学

  • 加法 +,
  • 减法 -,
  • 乘法 *,
  • 除法 /,
  • 取余 %,
  • 求幂 **（求幂运算 a ** b 是 a 乘以自身 b 次。适用于非整数）

+运算符

  • 作为二元运算符用于链接自负床
  • 作为一元运算符用于将运算元转化位数字

赋值运算符=

  • 语句 x = value 将值 value 写入 x 然后返回 x。

原地修改

  • 所有算术和位运算符都有简短的“修改并赋值”运算符：/= 和 -= 等。这类运算符的优先级与普通赋值运算符的优先级相同，所以它们在大多数其他运算之后执行

自增/自减

运算符 ++ 和 -- 可以置于变量前，也可以置于变量后。

  • 当运算符置于变量后，被称为“后置形式”：counter++。
  • 当运算符置于变量前，被称为“前置形式”：++counter。
  • 如果自增/自减的值不会被使用，那么两者形式没有区别
  • 如果我们想要对变量进行自增操作，并且 需要立刻使用自增后的值，那么我们需要使用前置形式
  • 如果我们想要将一个数加一，但是我们想使用其自增之前的值，那么我们需要使用后置形式

位运算符

  • 按位与 ( & )
  • 按位或 ( | )
  • 按位异或 ( ^ )
  • 按位非 ( ~ )
  • 左移 ( << )
  • 右移 ( >> )
  • 无符号右移 ( >>> )

参考 位操作符

逗号运算符

  • 逗号运算符能让我们处理多个语句，使用 , 将它们分开。每个语句都运行了，但是只有最后的语句的结果会被返回。
  • 请注意逗号运算符的优先级非常低，比 = 还要低

值的比较

  • 比较运算符始终返回布尔值。
  • 字符串的比较，会按照“词典”顺序逐字符地比较大小。
  • 当对不同类型的值进行比较时，它们会先被转化为数字（不包括严格相等检查）再进行比较。
  • 在非严格相等 == 下，null 和 undefined 相等且各自不等于任何其他的值。
  • 在使用 > 或 < 进行比较时，需要注意变量可能为 null/undefined 的情况。比较好的方法是单独检查变量是否等于 null/undefined。

条件分支：if 和 '?'

略

逻辑运算符

||（或）

一个或运算 || 的链，将返回第一个真值，如果不存在真值，就返回该链的最后一个值。

特殊用法

  1. 获取变量列表或者表达式中的第一个真值。

    用或运算符选择出有数据的那一个变量，如果都没有，则在或运算的链最后放一个值作为结果。

  2. 短路求值（Short-circuit evaluation）。

    || 对其参数进行处理，直到达到第一个真值，然后立即返回该值，而无需处理其他参数。利用这个特性，若操作数是一个有副作用的表达式则可以发挥作用。

&&（与）

与运算返回第一个假值，如果没有假值就返回最后一个值。

💡与运算 && 的优先级比或运算 || 要高。

!（非）

逻辑非运算符接受一个参数，并按如下运作：

  1. 将操作数转化为布尔类型：true/false。
  2. 返回相反的值。

两个非运算 !! 有时候用来将某个值转化为布尔类型，也可以使用内置的 Boolean 函数来转化位布尔类型

空值合并运算符'??'

  • 空值合并运算符 ?? 提供了一种从列表中选择第一个“已定义的”值的简便方式。

    它被用于为变量分配默认值：

    // 当 height 的值为 null 或 undefined 时，将 height 的值设置为 100
height = height ?? 100;

  • ?? 运算符的优先级非常低，仅略高于 ? 和 =，因此在表达式中使用它时请考虑添加括号。

  • 如果没有明确添加括号，不能将其与 || 或 && 一起使用。

循环

通常使用 while(true) 来构造“无限”循环。这样的循环和其他循环一样，都可以通过 break 指令来终止。

如果我们不想在当前迭代中做任何事，并且想要转移至下一次迭代，那么可以使用 continue 指令。

break/continue 支持循环前的标签。标签是 break/continue 跳出嵌套循环以转到外部的唯一方法。

"switch"语句

  • switch语句中判断的条件是是否严格相等（===）

函数

函数声明方式如下所示：

function name(parameters, delimited, by, comma) {
  /* code */
}
  • 作为参数传递给函数的值，会被复制到函数的局部变量。
  • 函数可以访问外部变量。但它只能从内到外起作用。函数外部的代码看不到函数内的局部变量。
  • 函数可以返回值。如果没有返回值，则其返回的结果是 undefined。

为了使代码简洁易懂，建议在函数中主要使用局部变量和参数，而不是外部变量。

与不获取参数但将修改外部变量作为副作用的函数相比，获取参数、使用参数并返回结果的函数更容易理解。

函数命名：

  • 函数名应该清楚地描述函数的功能。当我们在代码中看到一个函数调用时，一个好的函数名能够让我们马上知道这个函数的功能是什么，会返回什么。
  • 一个函数是一个行为，所以函数名通常是动词。
  • 目前有许多优秀的函数名前缀，如 create…、show…、get…、check… 等等。使用它们来提示函数的作用吧。

函数表达式

  • 函数是值。它们可以在代码的任何地方被分配，复制或声明。
  • 如果函数在主代码流中被声明为单独的语句，则称为“函数声明”。
  • 如果该函数是作为表达式的一部分创建的，则称其“函数表达式”。
  • 在执行代码块之前，内部算法会先处理函数声明。所以函数声明在其被声明的代码块内的任何位置都是可见的。
  • 函数表达式在执行流程到达时创建。

什么时候使用函数表达式：

例如：

严格模式下，当一个函数声明在一个代码块内时，它在该代码块内的任何位置都是可见的。但在代码块外不可见。

如果需要依赖于代码运行过程中产生的结果来声明函数，函数可能在一个代码块中，此时其他部分的代码将不能使用这个在代码块中声明的函数。

这时可以使用函数表达式，将函数赋值给在代码块外声明的变量

箭头函数

  1. 不带花括号：(...args) => expression — 右侧是一个表达式：函数计算表达式并返回其结果。
  2. 带花括号：(...args) => { body } — 花括号允许我们在函数中编写多个语句，但是我们需要显式地 return 来返回一些内容。

原文地址：JavaScript 基础知识

posted @ 2021-10-30 19:19  xloading  阅读(850)  评论(0)    收藏  举报