javaScript MDN 阅读笔记

文档地址：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Guide/Grammar_and_types
记录用时：2024/7/2 - 2024/7/4

基础

• JavaScript 区分大小写，JavaScript 是区分大小写的，并使用 Unicode 字符集（即支持 emoji😊 与汉字与(●'◡'●)等）。
• JavaScript 中每一个语句结束后要加分号（;），单独一行也可以，但不推荐。
• JavaScript 是从左往右扫描式执行的。

注释

• 单行注释双斜杠（//），多行注释（/* */ ），不允许嵌套。

声明

• 变量共有三种声明方式：var（声明一个变量） 、let（声明一个块作用域的局部变量） 、const（声明一个块作用域的只读常量，不可更改）。

什么是块作用域？答：块由一对大括号（{}）界定，并包含零个或多个语句和声明。语法是 { StatementList }。

变量

• JavaScript 标识符必须以字母、下划线（_）或者美元符号（$）开头，支持 Unicode 字符集。例如：Number_hits、temp99、$credit 和 _name 、😊、汉字。

声明变量

• 使用关键词 var 。例如 var x = 42。这个语法可以用来声明局部变量和全局变量。
• 直接赋值。例如 x = 42。在函数外使用这种形式赋值，会产生一个全局变量。不推荐。
• 使用关键词 let 。例如 let y = 13。这个语法可以用来声明块作用域的局部变量。
• 还可以像这样 let { bar } = foo。即创建一个名为 bar 的变量，并将 foo 对象中属性名与之相同的属性的值赋给它。

变量求值

• 用 var 或 let 语句声明的变量，如果没有赋初始值，则其值为 undefined。
• 如果访问一个未声明的变量会导致抛出 ReferenceError 异常。
• undefined 值在布尔类型环境中会被当作 false ，数值类型环境（即数学运算）中 undefined 值会被转换为 NaN（表示未定义或不可表示的值）。
• 对一个 null 变量求值时，空值 null 在数值类型环境中会被当作 0 来对待，而布尔类型环境中会被当作 false。

变量的作用域

• 全局变量：在函数之外声明的变量，可被当前文档中的任何其他代码所访问。
• 局部变量：在函数内部声明的变量，在函数内部声明的变量，
• 使用 var 声明的变量将成为语句块所在函数（或全局作用域）的局部变量，类似于全局变量，不等同于全局变量。
• 使用 let 声明的变量将成为语句块内（或全局作用域）的局部变量，类似于局部变量，不等同于局部变量，例如在全局空间下使用 let 声明了一个变量，那么这个变量就如同“全局变量”。

※ 变量提升

• 虽然可以变量提升，但不推荐在代码最后声明变量。
• 可以先使用变量稍后再声明变量，这一概念称为变量提升，JavaScript 变量就如同是被“提升”或移到了函数或语句的最前面。若使用变量的过程中没有对变量赋值，则默认赋值 undefined ，否则保持使用过程中所赋予的值，即使是最后声明时赋予了其它值。
• 对于 var 声明变量来说，遵循上述规则。
• 对于 let 和 const 来说，虽然同样会被提升变量到代码块的顶部但是不会被赋予初始值（相当于 JavaScript 在执行时提前预留出了声明变量的空间，但没有真的声明变量。与 var 不同，var 相当于直接在代码顶部提前声明了变量），且变量将从代码块一开始的时候就处在一个“暂时性死区”，直至变量被声明为止，所以在使用 let 或 const 声明变量时（注意，直接赋值会被当做全局变量，不推荐的做法），不能提前访问变量。故若使用 let 或 const 声明变量，let 或 const则必须处于代码块的最前面。

函数提升

• 只有函数才可以做到将函数自身实现代码置后，而提前这个调用这个函数方法。函数表达式不行（函数表达式：类似于将函数方法赋值给一个变量）。

全局变量

• 全局变量是全局对象的属性。在网页中，缺省的全局对象是 window ，所以可以用形如 window.variable 的语法来设置和访问全局变量。因此，可以通过指定 window 或 frame 的名字，在当前 window 或 frame 访问另一个 window 或 frame 中声明的全局变量，如：在文档里声明一个叫 phoneNumber 的全局变量，那么就可以在子框架里使用 parent.phoneNumber 的方式来引用它。

常量

• 常量不可以通过重新赋值改变其值，也不可以在代码运行时重新声明，它必须被初始化为某个值。
• 在同一作用域中，不能使用与变量名或函数名相同的名字来命名常量。习惯上常量名使用全大写。
• 常量是不受完全保护的，如果常量的值是一个引用类型（比如对象或数组），那么常量所引用的对象内部的属性或元素是可以改变的。

数据结构和类型

数据类型

• 七种基本数据类型：布尔值（Boolean）、null、undefined、数字（Number）、任意精度的整数（BigInt）、字符串（String）、代表（Symbol）。
• 最后一种数据类型：对象（Object）。对象和函数是这门语言的另外两个基本元素。可以把对象当作存放值的一个命名容器，然后将函数当作你的程序能够执行的步骤。

数据类型的转换

• JavaScript 是一种动态类型语言，与 PHP 一样不必一开始就指定数据类型，会根据需要自动转换。

数字转换为字符串

• 在包含数字和字符串的表达式中使用加法运算符（+）时，JavaScript 会把数字转换成字符串，其余情况不会。

字符串转换为数字

• 一些方法可以将字符串转换为数字，例如：parseFloat()，parseInt()。
• 字符串转换为数字的另一种方法是使用一元加法运算符。一元加法运算符，即在字符串前添加一个 + 号，一元加（+）运算符不会对数值产生任何影响，但会尝试将其转换为数字，例如：(+"1.1") + (+"1.1") = 2.2 // 注意：加入括号为清楚起见，不是必需的。

字面量

• 字面量（Literal）是一种在代码中直接表示值的方式，而不是通过变量或数据结构间接引用这些值，它们在代码中以固定的格式出现，可以直接被解析器识别和处理。例如：let num = 42; let str = "Hello, world!"; let obj = { key: "value" }; let arr = [1, 2, 3];

数组字面量

• 数组字面值是一个封闭在方括号对 ([]) 中的包含有零个或多个表达式的列表，其中每个表达式代表数组的一个元素。例如：var coffees = ["French Roast", "Colombian", "Kona"];

数组字面值中的多余逗号

• 若在同一行中连写两个逗号（,），数组中就会产生一个没有被指定的元素，其初始值是 undefined，如果是在元素列表的尾部添加了一个逗号，它将会被忽略。显式地将缺失的元素声明为 undefined，将大大提高你的代码的清晰度和可维护性。

布尔字面量

• 布尔类型有两种字面量：true 和 false。
• 对于布尔类型，true 和 false 就是原始值，它们直接表示逻辑上的真和假。然而，JavaScript 也提供了将原始布尔值包装成对象的能力，这就是所谓的“布尔对象”。例如：let boolObj = new Boolean(true); // 布尔对象

数字字面量

• 就是数学里面的数。多种基数的整数字面量和以 10 为基数的浮点数字面量。
• 虽然数字字面量必须是无符号的，但可以使用一元减（-），一元加（+）。

整数字面量

• 十进制（基数为 10）、十六进制（基数为 16）、八进制（基数为 8）以及二进制（基数为 2）。严格模式下，八进制整数字面量必须以 0o 或 0O 开头。

浮点数字面量

• 浮点数字面值指数部分以“e”或“E”开头，后面跟着一个整数，可以有正负号（即前缀“+”或“-”）。浮点数字面量至少有一位数字，而且必须带小数点或者“e”（大写“E”也可）。语法是：[(+|-)][digits][.digits][(E|e)[(+|-)]digits]，举例：3.1415926、.123456789、3.1E+12（3.1 × 10^12）、.1e-23（0.1×10^-23）。

对象字面量

• 对象字面值是封闭在花括号对（{}）中的一个对象的零个或多个“属性名—值”对的（元素）列表。
• 不能在一条语句的开头就使用对象字面值，因为此时左花括号（{）会被认为是一个语句块的起始符号。
• 对象属性的值可以是函数方法，字符串，变量，也可以嵌套使用。

• 对象属性名字可以是任意字符串，包括空串。如果对象属性名字不是合法的 javascript 标识符，它必须用引号包裹，且不能用点（.）访问属性值，而是使用方括号表示法（[]）来访问。举例：

  var car = { manyCars: { a: "Saab", b: "Jeep" }, 7: "Mazda" , '': '空字符串', '!': '砰！'}; 
  console.log(car.manyCars.b); // Jeep 
  console.log(car[7]); // Mazda  
  console.log(car[“”]); // 空字符串 
  console.log(car[”!“]); // 砰！

增强的对象字面量（高级功能）

var obj = {
  // __proto__
  __proto__: theProtoObj,
  // Shorthand for ‘handler: handler’
  handler,
  // Methods
  toString() {
    // Super calls
    return "d " + super.toString();
  },
  // Computed (dynamic) property names
  ["prop_" + (() => 42)()]: 42,
};

• __proto__ 属性：__proto__ 是一个特殊的属性，用于设置对象的原型。在这里，obj 的原型被设置为 theProtoObj。这意味着 obj 将继承 theProtoObj 中的所有可枚举和可配置的属性和方法，即可以直接通过 obj 访问 theProtoObj 中的内容。直接操作 __proto__ 并不推荐。
• 属性名简写：handler 这里使用了属性名简写语法，它允许省略等号后面的变量名，这等同于 handler: handler，但更简洁。
• 方法定义：toString() 方法是自定义的，它覆盖了默认的 toString() 方法。调用 obj.toString() 时，就执行这个自定义的 toString() 方法。
• 计算属性名：["prop_" + (() => 42)()] 这里定义了一个属性，其名字是一个表达式的结果。这个表达式是一个立即执行的函数表达式（IIFE），返回值为 42。因此，这个属性的名字就是 "prop_42"，并且它的值也是 42。

var foo = { a: "alpha", 2: "two" };
console.log(foo.a); // alpha
console.log(foo[2]); // two
//console.log(foo.2);  // SyntaxError: missing ) after argument list
//console.log(foo[a]); // ReferenceError: a is not defined
console.log(foo["a"]); // alpha
console.log(foo["2"]); // two

• 对象的属性可以不用加引号，但要注意的是，他其实是一个字符串，访问它需要加上引号。

RegExp(正则表达式) 字面值

• 一个正则表达式是字符被正斜杠“/”围成的表达式。例如：var re = /ab+c/;

字符串字面量

• 字符串字面量的引号必须是成对出现的。
• 可以在字符串字面值上使用字符串对象的所有方法（中间将字符串临时转换为了字符串对象，一般直接用字符串字面量），例如：console.log("John's cat".length);
• 还提供了一种模板字面量的语法糖（一种不会改变语言的核心功能或逻辑，而是为了让程序员编写和阅读代码更加方便的语法形式，不能吃），就是可以在字符串的反引号（ ` ）里使用变量，格式： `${变量名}` ，例如： `Hello ${name}, how are you ${time}?`; ，在反引号里面的字符串内容可以换行。

在字符串中使用的特殊字符

• 就是在字符串中弄个空格啊，制表符什么的，具体见上面图片对应区域的表格。

转义字符

• 使用反斜线 \ 可以转义上面的特殊字符。例如：var quote = "He read \"The Cremation of Sam McGee\" by R.W. Service.";
• 反斜线 \ 也可以当作换行使用，当一个语句过长时使用反斜线 \ 分开换行写。