JavaScript
2025-01-16 11:24:26 5 举报AI智能生成
JaveScript基础
作者其他创作
大纲/内容
中级
Objects
对象原型 Object.prototype
JavaScript 中所有的对象都有一个内置属性，称为它的 prototype（原型）。它本身是一个对象，故原型对象也会有它自己的原型，逐渐构成了原型链。原型链终止于拥有 null 作为其原型的对象上。
当你试图访问一个对象的属性时：如果在对象本身中找不到该属性，就会在原型中搜索该属性。如果仍然找不到该属性，那么就搜索原型的原型，以此类推，直到找到该属性，或者到达链的末端，在这种情况下，返回 undefined。
属性遮蔽
如果你在一个对象中定义了一个属性，而在该对象的原型中定义了一个同名的属性。类似于重写
设置原型
Object.create() 方法创建一个新的对象，并允许你指定一个将被用作新对象原型的对象。
使用构造函数
异步 JavaScript
Promise
Promise 有三种状态
待定（pending）：初始状态，既没有被兑现，也没有被拒绝。这是调用 fetch() 返回 Promise 时的状态，此时请求还在进行中。
已兑现（fulfilled）：意味着操作成功完成。当 Promise 完成时，它的 then() 处理函数被调用。
已拒绝（rejected）：意味着操作失败。当一个 Promise 失败时，它的 catch() 处理函数被调用。
链式使用 Promise
合并使用多个 Promise
在这种情况下，将它们一起启动然后在它们全部被兑现后得到通知会更有效率。这里需要 Promise.all() 方法。它接收一个 Promise 数组，并返回一个单一的 Promise。
async 和 await
在一个函数的开头添加 async，就可以使其成为一个异步函数。
在异步函数中，你可以在调用一个返回 Promise 的函数之前使用 await 关键字。这使得代码在该点上等待，直到 Promise 被完成
客户端 Web API
视频、音频API
绘图
客户端存储
老做派：cookie
新流派：Web 存储和 IndexedDB
存储简单数据——Web 存储
sessionStorage 只要浏览器开着，数据就会一直保存（关闭浏览器时数据会丢失）
localStorage 一直保存数据，甚至到浏览器关闭又开启后也是这样
localStorage.setItem("name", "Chris"); 存储
let myName = localStorage.getItem("name");
myName; 获取/查询
myName; 获取/查询
localStorage.removeItem("name");
myName = localStorage.getItem("name");
myName; 删除
myName = localStorage.getItem("name");
myName; 删除
存储复杂数据——IndexedDB
对象属性的可枚举性和所有权
查询对象属性
遍历对象属性
闭包
闭包是由捆绑起来（封闭的）的函数和函数周围状态（词法环境）的引用组合而成。换言之，闭包让函数能访问它的外部作用域。在 JavaScript 中，闭包会随着函数的创建而同时创建。
实用的闭包
用闭包模拟私有方法
闭包作用域链
嵌套函数能访问的外部函数作用域包括外部函数包围的作用域——高效地创建一条函数作用域链。
表达式和运算符
异步函数（async function）表达式
async function* 表达式
await
await 通常用于拆开 promise 的包装，使用方法是传递一个 Promise 作为 expression。使用 await 总会暂停当前异步函数的执行，在该 Promise 敲定（settled，指兑现或拒绝）后继续执行。
delete 运算符
delete 运算符用于删除对象的一个属性；
解构赋值
描述
对象和数组字面量表达式提供了一种简单的方法来创建特别的数据包。
解构赋值使用类似的语法，但在赋值的左侧定义了要从原变量中取出哪些值。
同样，你可以在赋值语句的左侧解构对象。
剩余属性
你可以使用剩余属性（...rest）结束解构模式。此模式会将对象或数组的所有剩余属性存储到新的对象或数组中。
逻辑空赋值（??=）
逻辑空赋值运算符（x ??= y）仅在 x 是空值（null 或 undefined）时对其赋值。
空值合并运算符（??）
空值合并运算符（??）是一个逻辑运算符，当左侧的操作数为 null 或者 undefined 时，返回其右侧操作数，否则返回左侧操作数。
可选链运算符（?.）
可选链运算符（?.） 用于访问对象的属性或调用函数。如果使用此运算符访问的对象或调用的函数是 undefined 或 null，则表达式会短路并计算为 undefined，而不是抛出错误。
展开语法
函数调用：
字面量数组构造或字符串：
构造字面量对象时，进行克隆或者属性拷贝（ECMAScript 2018 规范新增特性）：
构造字面量数组时使用展开语法
在函数调用时使用展开语法
数组拷贝 (copy)
连接多个数组
构造字面量对象时使用展开语法
JavaScript 指南
1、语法和数据类型
变量名称区分大小写
；分隔
// 单行注释
/**多行注释*/
var 声明局部变量和全局变量
变量提升
let 块级变量
const 块级常量
在同一作用域中，不能使用与变量名或函数名相同的名字来声明常量。
以字母、下划线（_）或者美元符号（$）开头
全局变量 window
数据类型
1、Boolean。true 和 false。
2、null。一个表示空值的特殊关键字。（因为 JavaScript 是区分大小写的，所以 null 和 Null、NULL 或其他变体是不一样的。）
3、undefined。一个未定义值的顶级属性。
4、Number。整数或浮点数。例如，42 或 3.14159。
5、BigInt。任意精度的整数。例如，9007199254740992n。
6、String。表示文本值的字符序列。例如，"Howdy"。
7、Symbol。其实例是唯一且不可变的数据类型。
8、Object
2、控制流与错误处理
if
下面这些值求值为 false
false
undefined
null
0
NaN
空字符串（""）
undefined
null
0
NaN
空字符串（""）
其他情况会时true
for
while
switch
异常处理语句
try...catch 语句
throw 语句
3、循环和迭代
1、for 语句
2、do...while
3、while
4、label语句
5、for...in 语句
6、for...of 语句
for...in和for...of的区别
for...in 语句用于遍历对象的所有可枚举属性（包括从原型链继承的可枚举属性），for...of 语句用于遍历可迭代对象（如数组、字符串、Map、Set等）的值。：
for...in 遍历对象的属性名，而 for...of 遍历的是值。
for...in 可以遍历对象的属性，包括那些继承自原型链上的属性；for...of 则专注于遍历具有迭代协议的数据结构。
4、函数
由 function 关键字
将对象作为参数传递，而函数改变了这个对象的属性，这样的改变对函数外部是可见的
将数组作为参数传递，而函数改变了这个数组的值，这样的改变对函数外部也同样可见
参数可以是对象、数组、函数
定义的函数并不会自动执行它，调用函数才会以给定的参数真正执行这些动作。
函数提升
JavaScript 解释器会将整个函数声明提升到当前作用域的顶部
函数提升仅适用于函数声明，而不适用于函数表达式。
作用域和函数栈
递归
嵌套函数和闭包
在一个函数里面嵌套另外一个函数
闭包
内部函数只可以在外部函数中访问。
内部函数形成了一个闭包：它可以访问外部函数的参数和变量，但是外部函数却不能使用内部函数的参数和变量。
闭包
闭包是 JavaScript 中最强大的特性之一。JavaScript 允许函数嵌套，并且内部函数具有定义在外部函数中的所有变量和函数（以及外部函数能访问的所有变量和函数）的完全访问权限。
但是，外部函数却不能访问定义在内部函数中的变量和函数。这给内部函数的变量提供了一种封装。
由于内部函数可以访问外部函数的作用域，因此当内部函数生存周期大于外部函数时，外部函数中定义的变量和函数的生存周期将比内部函数执行的持续时间要长。当内部函数以某一种方式被任何一个外部函数之外的任何作用域访问时，就会创建闭包。
使用 arguments 对象
函数的实际参数会被保存在一个类似数组的 arguments 对象中
arguments 变量只是“类数组”，而不是数组。它与数组类似，有索引编号和 length 属性。尽管如此，它并不具备 Array 对象的所有数组操作方法。
函数参数
在 JavaScript 中，函数参数的默认值是 undefined
剩余参数， ...theArgs
剩余参数语法允许将不确定数量的参数表示为数组。
箭头函数
有两个因素会影响对箭头函数的引入：更简洁的函数和 this 的无绑定性。
内置函数
eval()
isFinite()
isNaN()
parseFloat()
parseInt()
decodeURI()
等...
5、表达式与运算符
运算符
赋值运算符
赋值运算符将它右边操作数的值赋给它左边的操作数。最简单的赋值运算符是等于（=），它将右边的操作数值赋给左边的操作数。那么 x = y 就是将 y 的值赋给 x。
解构
比较运算符
=== 和 !== 操作符，它们会执行严格的相等和不相等比较
算术运算符
位运算符
字符串运算符 +
条件（三元）运算符
条件 ? 值 1 : 值 2
逗号操作符
一元操作符
delete 删除一个对象的属性或者一个数组中某一个键值
typeof
类型将被返回
instanceof
如果所判别的对象确实是所指定的类型，则返回true。
表达式
this 关键字被用于指代当前的对象，通常，this指代的是方法中正在被调用的对象。
分组操作符（）控制了表达式中计算的优先级。
6、数字和日期
数字
在 JavaScript 里面，数字均为双精度浮点类型
除了能够表示浮点数，数字类型也还能表示三种符号值：+Infinity（正无穷）、-Infinity（负无穷）和 NaN (not-a-number，非数字)。
数字对象 Number
数学对象 Math
日期对象
7、文本格式化
字符串
String 字面量
字符串对象
多行模板字符串 反勾号 (` `)
日期和时间格式化 DateTimeFormat
数字格式化 NumberFormat
8、正则表达式
9、Arrary数组集合
包括数组和类数组结构，如 Array 对象和 TypedArray 对象。
filter() 方法返回一个新数组，其中过滤条件返回 true 的元素。
find() 方法返回过滤条件 true 的第一个元素。
map() 方法返回由每个数组元素上执行 映射的返回值所组成的新数组。
findLast() 方法返回过滤条件 true 的最后一个元素。
10、带键的集合Map、Set
Map
for...of 循环来在每一次迭代中得到 [key, value] 数组。
Set 值不能重复
11、Object
创建 var myCar = new Object();
使用 Object.create 方法
对象中未赋值的属性的值为undefined（而不是null）。
JavaScript 对象的属性也可以通过方括号访问或者设置 myCar["make"] = "Ford";
枚举一个对象的所有属性
for...in 循环 该方法依次访问一个对象及其原型链中所有可枚举的属性。
Object.keys(o) 该方法返回对象 o 自身包含（不包括原型中）的所有可枚举属性的名称的数组。
Object.getOwnPropertyNames(o) 该方法返回对象 o 自身包含（不包括原型中）的所有属性 (无论是否可枚举) 的名称的数组。
对象属性索引
你可以通过 prototype属性为之前定义的对象类型增加属性
12、使用类
13、使用 Promise
Promise 是一个对象，它代表了一个异步操作的最终完成或者失败。
本质上 Promise 是一个函数返回的对象，我们可以在它上面绑定回调函数，这样我们就不需要在一开始把回调函数作为参数传入这个函数了。
链式调用
连续执行两个或者多个异步操作是一个常见的需求
使用async/await
14、迭代器和生成器
生成器函数
可迭代对象
内置可迭代对象
String、Array、TypedArray、Map 和 Set 都是内置可迭代对象，因为它们的原型对象都拥有一个 Symbol.iterator 方法。
15、元编程proxy、reflect
Proxy
Proxy 对象可以拦截某些操作并实现自定义行为。
可以用 Proxy.revocable() 方法来创建可撤销的 Proxy 对象。这意味着可以通过 revoke 函数来撤销并关闭一个代理。
Reflect
16、JavaScript 模块 export import
导出模块的功能，export 语句来完成。
你能够导出函数 var、let、const 和等会看到的类。export 要放在最外层；比如你不能够在函数内使用 export。
更方便的导出模块的方法是，在模块文件末尾使用一个 export 语句，以花括号括起来并用逗号分隔的形式列出所有需导出的功能。
导入功能到你的脚本
你可以使用 import 语句，然后用花括号括起来的用逗号分割的功能列表，然后是关键字 from，然后是模块标识符（module specifier）。
内置对象
0 条评论
下一页
