Forem: Roger Lin

JavaScript —— Aysnc

Roger Lin — Fri, 24 Feb 2023 02:52:47 +0000

Promise

状态

Pending: 初始状态
Fulfilled: 成功
Rejected: 失败

静态方法

Promise.resolve(): Fulfilled 的 promise
Promise.reject(): Rejected 的 promise
Promise.all(): 所有 promise 成功为 Fulfilled, 否则为 Rejected
Promise.allSettled(): 所有 promise 的结果数组
Promise.race(): 最快 Fulfilled 或 Rejected 的 promise
Promise.any(): 最快 Fulfilled 的 promise

实例方法

then(): Fulfilled 或 Rejected 后执行
catch(): 发生错误时执行
finally(): 最后始终执行

异步函数

异步函数返回一个 Promise.

async func1() {...}

async func2() {
  await func1()
  ...
}

JavaScript —— Class

Roger Lin — Fri, 24 Feb 2023 02:34:17 +0000

类定义

类声明: class Person {...}
类表达式: const Person = class {...}

类声明和函数声明不同的是, 类声明不会提升, 在类声明前使用, 将抛出 ReferenceError.

类方法

构造函数: constructor() {...}
get 方法: get name() {...}
set 方法: set name() {...}
原型方法: func() {...}
静态方法: static func() {...}
私有方法: #func() {...}

类属性

静态属性: static name = 'itroger'
公有属性: name = 'itroger'
私有属性: #name = 'itroger'

继承

类继承: class Dog extends Animal {...}
使用 super 调用父类
使用 this 引用类本身

JavaScript —— Collections

Roger Lin — Thu, 23 Feb 2023 11:26:32 +0000

Map

保证顺序的 key-value 映射集合.

实例属性

size: 成员数量

实例方法

get(): 根据 key 获取 value
set(): 根据 key 设置 value
has(): 是否存在 key
delete(): 根据 key 删除
clear(): 清空
forEach(): 遍历
entries(): 返回 [key, value] 迭代器
keys(): 返回 key 迭代器
values(): 返回 value 迭代器

Object 的 key 必须为 String 类型, Map 的 key 为任意类型.

Object 的成员数量需要手动计算, Map 可以通过 size 属性读取.

Object 遍历不能保证顺序, Map 遍历和插入顺序一直.

Object 有原型, 存在原型链上的 key.

WeakMap 的 key 必须为对象类型, 没有遍历和清空方法.

Set

存储任意类型的唯一值且保证顺序, 常用于去重.

实例属性

size: 成员数量

实例方法

add(): 新增 value
has(): 是否存在 value
delete(): 删除 value
clear(): 清空
forEach(): 遍历
entries(): 返回 [value, value] 迭代器
keys(): 返回 value 迭代器
values(): 返回 value 迭代器

WeakSet 的 key 必须为对象类型, 没有遍历和清空方法.

JavaScript —— Function

Roger Lin — Thu, 23 Feb 2023 11:05:32 +0000

实例方法

apply(thisArg, argsArray)
call(thisArg, arg, ...)
bind(thisArg, arg, ...)

定义函数

函数声明: function func(){}
函数表达式: const func = function(){}
箭头函数: const func = () => {}

函数声明存在提升

箭头函数没有 this, 没有原型链, 不能被 new, 不能使用函数的实例方法.

内置函数

eval(): 字符串解析成代码执行
isfinite(): 是否为有限的数字
parseFloat(): 字符串转成浮点数
parseInt(): 字符串转成整数
encodeURI(): 编码
decodeURI(): 解码
encodeURIComponent(): 编码
decodeURIComponent(): 解码

JavaScript —— Object

Roger Lin — Thu, 23 Feb 2023 10:05:57 +0000

静态方法

对象操作

Object.assign(): 从一个或多个源对象复制可枚举的自有属性到目标对象
Object.create(): 使用现有的对象作为新创建对象的原型
Object.fromEntries(): 将 [key, value] 列表转化成对象

对象判断

Object.is(): 是否为同一对象
Object.isExtensible(): 是否可添加属性
Object.isFrozen(): 是否被冻结属性
Object.isSealed(): 是否被密封
Object.freeze(): 冻结对象属性不能新增或修改
Object.preventExtensions(): 禁止对象新增属性
Object.seal(): 禁止添加新属性并且现有属性不可配置

对象原型

Object.getPrototypeOf(): 对象原型
Object.setPrototypeOf(): 设置原型

属性操作

Object.defineProperty(): 新增或修改一个属性
Object.defineProperties(): 新增或修改多个属性
Object.getOwnPropertyDescriptor(): 对象的一个自有属性描述符
Object.getOwnPropertyDescriptors(): 对象的所有自有属性描述符
Object.getOwnPropertyNames(): 对象的所有自有属性名数组
Object.getOwnPropertySymbols(): 对象自有 Symbol 属性数组
Object.hasOwn(): 是否为自有属性

对象遍历

Object.entries(): 返回可枚举自有属性的 [key, value] 迭代对象
Object.keys(): 返回可枚举自有属性的 key 迭代对象
Object.values(): 返回可枚举自有属性的 value 迭代对象

实例方法

对象原型

Object.prototype.isPrototypeOf(): 是否为原型链

属性操作

Object.prototype.hasOwnProperty(): 是否为自有属性
Object.prototype.propertyIsEnumerable(): 属性是否可枚举

JavaScript —— Array

Roger Lin — Thu, 23 Feb 2023 09:39:17 +0000

静态方法

Array.from(): 使用迭代对象创建数组
Array.isArray(): 是否为数组
Array.of(): 使用元素创建数组

实例属性

length: 数组长度

实例方法

访问元素

at(): 根据索引访问元素

填充数组

fill(): 填充数组, 改变原数组
concat(): 合并数组
copyWithin(): 复制部分数组到另一位置, 改变原数组

遍历数组

entries(): 返回一个 [key, value] 的迭代器对象
keys(): 返回一个 key 的迭代器对象
values(): 返回一个 value 的迭代器对象
forEach(): 遍历数组
map(): 遍历并返回一个新数组
filter(): 过滤数组
every(): 是否全部通过
some(): 是否至少一个通过
reduce(): 从左到右累计操作
reduceRight(): 从右到左累计操作

搜索数组

includes(): 是否存在元素
indexOf(): 查找第一个匹配的 key
lastIndexOf(): 查找最后一个匹配的 key
findIndex(): 查找第一个匹配的 key
findLastIndex(): 查找最后一个匹配的 key
find(): 查找第一个匹配的 value
findLast(): 查找最后一个匹配的 value

数组操作

push(): 入栈, 改变原数组
pop(): 出栈, 改变原数组
unshift(): 开头入栈, 改变原数组
shift(): 开头出栈, 改变原数组
reverse(): 倒置数组, 改变原数组
sort(): 排序数组, 改变原数组
splice(): 删增数组, 改变原数组
join(): 指定间隔转成字符串
slice(): 切片数组

扁平化数组

flat(): 指定深度扁平化数组
flatMap(): 深度为 1 扁平化数组后使用 map() 方法

对象数组转化成对象

group(): 对象数组转化成 Object
groupToMap(): 对象数组转化成 Map

JavaScript —— String

Roger Lin — Thu, 23 Feb 2023 08:50:08 +0000

静态方法

String.fromCharCode(): UTF-16 编码创建字符串
String.fromCodePoint(): Unicode 编码创建字符串
String.raw(): 模版字符串创建字符串

实例属性

length: 字符串长度

实例方法

访问字符

at(): 索引字符, 支持负数索引
charAt(): 索引字符, 不支持负数索引
charCodeAt(): 索引字符对应的 UTF-16 编码
codePointAt(): 索引字符对应的 Unicode 编码

转换字符串

toUpperCase(): 转成全部大写
toLowerCase(): 转成全部小写
toLocaleUpperCase(): 根据环境转成全部大写
toLocaleLowerCase(): 根据环境转成全部小写

判断字符串

startsWith(): 是否以子串开头
endsWith(): 是否以子串结尾
includes(): 是否包含子串
localeCompare(): 判断两个字符串的字典顺序

搜索字符串

indexOf(): 从左到右, 子串第一次匹配得到的索引
lastIndexOf(): 从右到左, 子串第一次匹配得到的索引
search(): 正则搜索子串得到的索引

匹配替换字符串

match(): 匹配正则的结果
matchAll(): 匹配所有正则的结果
replace(): 替换第一个匹配的子串
replaceAll() 替换所有匹配的子串

填充字符串

padStart(): 左侧填充指定字符达到指定长度
padEnd(): 右侧填充指定字符达到指定长度
repeat(): 重复指定次数字符串
concat() 合并字符串

字符串操作

slice(): 切片字符串, 支持负数参数
substring(): 切片字符串,不支持负数参数
split(): 分隔成数组

清除空格

trim(): 清除两端空格
trimStart(): 清除开头空格
trimEnd(): 清除末尾空格

序列化

normalize(): 以 Unicode 形式序列化字符串

JavaScript —— Number

Roger Lin — Thu, 23 Feb 2023 07:50:39 +0000

静态属性

Number.MAX_VALUE: 最大值
Number.MIN_VALUE: 最小值
Number.MAX_SAFE_INTEGER: 最大安全整数
Number.MIN_SAFE_INTEGER: 最小安全整数
Number.POSITIVE_INFINITY: 正无穷
Number.NEGATIVE_INFINITY: 负无穷
Number.EPSILON: 最小间隔
Number.NaN: 非数字

静态方法

Number.parseFloat(): 字符串转化成浮点数
Number.parseInt(): 字符串转化成整数
Number.isInteger(): 是否整数
Number.isSafeInteger(): 是否安全整数
Number.isFinite(): 是否有穷数
Number.isNaN(): 是否非数字

实例方法

toFixed(): 保留几位小数表示
toPrecision(): 保留有效位数表示
toExponential(): 指数表示

JavaScript —— Foundations

Roger Lin — Thu, 23 Feb 2023 07:34:25 +0000

声明

let: 声明块级作用域变量
const: 声明块级作用域常量
var: 声明函数级作用变量（不推荐使用）

都存在变量提升，但 let 和 const 不会被赋予初始值, 在声明前使用将抛出引用错误(ReferenceError).

数据类型

boolean
null
undefined
number
bigint
string
symbol
object

基本数据类型判断使用 typeof : boolean, undefined, number, string, object, function.

引用类型判断使用 instanceof.

属性判断使用 in.

流程控制

if...else if...else
switch...case...default
throw
try...catch...finally

循环与迭代

for
do...while
while
continue
break
for...in: 遍历 key, 数组慎用
for...of: 遍历 value, 对象不可用
for await...of: 遍历异步迭代

模块

导出原则: 导出不可变数据, 例如 const, function, class.

导出: export const name = 'itroger'
默认导出 export default function func() {}
导出重命名: export { func as func1 }
导入: import { name } from '...'
导入默认的导出: import func from '...'
导入重命名: import { func as func1 } from '...'

新运算符

nullish 表示值为 null 或 undefined.

?.: 可选链运算符, 在引用为 nullish 时短路返回
??: 空值合并表运算符, 左侧为 nullish 时返回右侧
??=: 逻辑空赋值, 左侧为 nullish 时赋值
...: 展开运算符, 直接获取元素