John Doe
John Doe
Articles3
Tags4
Categories1
回到首页
文章归档
我的朋友
给我赞助
关于博主

Categories

Archive

Recent Posts

© 2026 John Doe Powered by Hexo & Nexmoe
yuliona 笔记站
JS常用方法整理

JS常用方法整理

2026年01月21日 JS

JavaScript 常用方法速查表

一、数组方法 (Array Methods)

1. 添加/删除元素

push() - 尾部添加

1
2
3
let arr = [1, 2, 3];
arr.push(4, 5);       // 返回新长度: 5
console.log(arr);     // [1, 2, 3, 4, 5]

pop() - 尾部删除

1
2
3
let arr = [1, 2, 3];
let last = arr.pop(); // 返回: 3
console.log(arr);     // [1, 2]

unshift() - 头部添加

1
2
3
let arr = [1, 2, 3];
arr.unshift(0);       // 返回新长度: 4
console.log(arr);     // [0, 1, 2, 3]

shift() - 头部删除

1
2
3
let arr = [1, 2, 3];
let first = arr.shift(); // 返回: 1
console.log(arr);        // [2, 3]

splice() - 万能方法（增删改）

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
// 语法: arr.splice(start, deleteCount, ...items)
let arr = ['a', 'b', 'c', 'd'];

// 删除
arr.splice(1, 2);         // 从索引1删除2个元素，返回 ['b', 'c']
console.log(arr);         // ['a', 'd']

// 插入
arr.splice(1, 0, 'x', 'y'); // 在索引1处插入，不删除
console.log(arr);           // ['a', 'x', 'y', 'd']

// 替换
arr.splice(1, 2, 'new');  // 删除2个，插入1个
console.log(arr);         // ['a', 'new', 'd']

// 负索引
let arr2 = [1, 2, 3, 4, 5];
arr2.splice(-1, 0, 'x');  // 在倒数第1个位置前插入
console.log(arr2);        // [1, 2, 3, 4, 'x', 5]

slice() - 截取数组（不修改原数组）

1
2
3
4
5
6
// 语法: arr.slice(start, end) - 不包含 end
let arr = ['a', 'b', 'c', 'd', 'e'];

console.log(arr.slice(1, 3));   // ['b', 'c']
console.log(arr.slice(-2));     // ['d', 'e']
console.log(arr.slice());       // 复制整个数组

concat() - 合并数组

1
2
3
4
let arr1 = [1, 2];
let arr2 = [3, 4];
let result = arr1.concat(arr2, 5, 6);
console.log(result);  // [1, 2, 3, 4, 5, 6]

2. 搜索元素

indexOf() / lastIndexOf()

1
2
3
4
5
6
let arr = [1, 2, 3, 2, 1];

arr.indexOf(2);        // 1 (第一个2的索引)
arr.lastIndexOf(2);    // 3 (最后一个2的索引)
arr.indexOf(2, 2);     // 3 (从索引2开始搜索)
arr.indexOf(5);        // -1 (未找到)

includes() - 是否包含

1
2
3
4
5
let arr = [1, 2, NaN];

arr.includes(2);       // true
arr.includes(5);       // false
arr.includes(NaN);     // true (indexOf无法检测NaN)

find() - 查找元素

1
2
3
4
5
6
7
8
let users = [
  { id: 1, name: '张三' },
  { id: 2, name: '李四' },
  { id: 3, name: '王五' }
];

let user = users.find(item => item.id === 2);
console.log(user);  // { id: 2, name: '李四' }

findIndex() / findLastIndex()

1
2
3
4
let arr = [5, 12, 8, 130, 44];

arr.findIndex(x => x > 10);      // 1 (第一个大于10的索引)
arr.findLastIndex(x => x > 10);  // 4 (最后一个大于10的索引)

filter() - 过滤数组

1
2
3
let arr = [1, 2, 3, 4, 5, 6];
let evens = arr.filter(x => x % 2 === 0);
console.log(evens);  // [2, 4, 6]

3. 转换数组

map() - 映射

1
2
3
4
5
6
7
8
let arr = [1, 2, 3];
let doubled = arr.map(x => x * 2);
console.log(doubled);  // [2, 4, 6]

// 实用：提取对象属性
let users = [{ name: '张三' }, { name: '李四' }];
let names = users.map(u => u.name);
console.log(names);  // ['张三', '李四']

sort() - 排序（原地修改）

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
// 默认按字符串排序
let arr1 = [1, 15, 2, 21];
arr1.sort();
console.log(arr1);  // [1, 15, 2, 21] (按字符串!)

// 数字排序
let arr2 = [1, 15, 2, 21];
arr2.sort((a, b) => a - b);  // 升序
console.log(arr2);  // [1, 2, 15, 21]

arr2.sort((a, b) => b - a);  // 降序
console.log(arr2);  // [21, 15, 2, 1]

// 字符串排序（支持中文）
let countries = ['中国', '德国', '澳大利亚'];
countries.sort((a, b) => a.localeCompare(b, 'zh'));

reverse() - 反转（原地修改）

1
2
3
let arr = [1, 2, 3];
arr.reverse();
console.log(arr);  // [3, 2, 1]

join() - 数组转字符串

1
2
3
let arr = ['Hello', 'World'];
console.log(arr.join(' '));   // 'Hello World'
console.log(arr.join('-'));   // 'Hello-World'

reduce() - 累积计算

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
// 语法: arr.reduce((accumulator, current, index, array) => {}, initialValue)

// 求和
let arr = [1, 2, 3, 4, 5];
let sum = arr.reduce((acc, cur) => acc + cur, 0);
console.log(sum);  // 15

// 找最大值
let max = arr.reduce((a, b) => Math.max(a, b));
console.log(max);  // 5

// 数组去重
let arr2 = [1, 2, 2, 3, 3, 3];
let unique = arr2.reduce((acc, cur) => {
  if (!acc.includes(cur)) acc.push(cur);
  return acc;
}, []);
console.log(unique);  // [1, 2, 3]

// 分组
let people = [
  { name: '张三', age: 20 },
  { name: '李四', age: 20 },
  { name: '王五', age: 25 }
];
let grouped = people.reduce((acc, person) => {
  let key = person.age;
  if (!acc[key]) acc[key] = [];
  acc[key].push(person);
  return acc;
}, {});

reduceRight() - 从右向左累积

1
2
3
let arr = [[1, 2], [3, 4], [5, 6]];
let flattened = arr.reduceRight((acc, cur) => acc.concat(cur), []);
console.log(flattened);  // [5, 6, 3, 4, 1, 2]

4. 遍历方法

forEach() - 遍历

1
2
3
4
5
6
7
let arr = ['a', 'b', 'c'];
arr.forEach((item, index, array) => {
  console.log(`${index}: ${item}`);
});
// 0: a
// 1: b
// 2: c

some() - 是否有满足条件的

1
2
3
let arr = [1, 2, 3, 4, 5];
let hasEven = arr.some(x => x % 2 === 0);
console.log(hasEven);  // true

every() - 是否全部满足条件

1
2
3
let arr = [2, 4, 6, 8];
let allEven = arr.every(x => x % 2 === 0);
console.log(allEven);  // true

5. 其他数组方法

Array.isArray() - 判断是否为数组

1
2
3
Array.isArray([1, 2, 3]);  // true
Array.isArray('abc');      // false
Array.isArray({ length: 3 });  // false

Array.from() - 从类数组创建数组

1
2
3
4
5
6
7
8
9
10
11
// 从字符串
Array.from('abc');  // ['a', 'b', 'c']

// 从 Set
Array.from(new Set([1, 2, 2, 3]));  // [1, 2, 3]

// 带映射函数
Array.from([1, 2, 3], x => x * 2);  // [2, 4, 6]

// 生成序列
Array.from({ length: 5 }, (_, i) => i);  // [0, 1, 2, 3, 4]

Array.of() - 创建数组

1
2
Array.of(1, 2, 3);  // [1, 2, 3]
Array.of(7);        // [7] (不是长度为7的空数组)

flat() - 扁平化

1
2
3
4
5
let arr = [1, [2, [3, [4]]]];

arr.flat();      // [1, 2, [3, [4]]] (默认1层)
arr.flat(2);     // [1, 2, 3, [4]]
arr.flat(Infinity);  // [1, 2, 3, 4] (完全扁平)

flatMap() - 映射后扁平化

1
2
3
let arr = [1, 2, 3];
let result = arr.flatMap(x => [x, x * 2]);
console.log(result);  // [1, 2, 2, 4, 3, 6]

fill() - 填充

1
2
3
4
5
6
let arr = [1, 2, 3, 4];
arr.fill(0);        // [0, 0, 0, 0]
arr.fill(5, 1, 3);  // [0, 5, 5, 0]

// 创建并填充
new Array(5).fill(0);  // [0, 0, 0, 0, 0]

copyWithin() - 内部复制

1
2
let arr = [1, 2, 3, 4, 5];
arr.copyWithin(0, 3);  // [4, 5, 3, 4, 5]

at() - 索引访问（支持负索引）

1
2
3
4
let arr = [1, 2, 3, 4, 5];
arr.at(0);   // 1
arr.at(-1);  // 5
arr.at(-2);  // 4

二、字符串方法 (String Methods)

1. 查找和搜索

indexOf() / lastIndexOf()

1
2
3
4
5
6
let str = 'Hello World Hello';

str.indexOf('Hello');       // 0
str.lastIndexOf('Hello');   // 12
str.indexOf('hello');       // -1 (区分大小写)
str.indexOf('o', 5);        // 7 (从索引5开始)

includes()

1
2
3
4
let str = 'Hello World';
str.includes('World');      // true
str.includes('world');      // false
str.includes('o', 8);       // false (从索引8开始)

startsWith() / endsWith()

1
2
3
4
5
let str = 'Hello World';
str.startsWith('Hello');    // true
str.startsWith('World', 6); // true (从索引6开始)
str.endsWith('World');      // true
str.endsWith('Hello', 5);   // true (前5个字符)

search() - 正则搜索

1
2
3
let str = 'Hello World';
str.search(/world/i);  // 6 (忽略大小写)
str.search(/xyz/);     // -1

match() - 正则匹配

1
2
3
4
5
6
7
8
9
10
11
let str = 'The rain in Spain';

// 单次匹配
str.match(/ain/);  // ['ain', index: 5, ...]

// 全局匹配
str.match(/ain/g);  // ['ain', 'ain']

// 捕获组
'2024-01-15'.match(/(\d{4})-(\d{2})-(\d{2})/);
// ['2024-01-15', '2024', '01', '15', ...]

matchAll() - 所有匹配（带详情）

1
2
3
let str = 'test1test2';
let matches = [...str.matchAll(/test(\d)/g)];
// [['test1', '1', ...], ['test2', '2', ...]]

2. 截取和分割

slice()

1
2
3
4
5
let str = 'Hello World';
str.slice(0, 5);    // 'Hello'
str.slice(6);       // 'World'
str.slice(-5);      // 'World'
str.slice(-5, -2);  // 'Wor'

substring()

1
2
3
4
let str = 'Hello World';
str.substring(0, 5);  // 'Hello'
str.substring(6);     // 'World'
// 注意：不支持负索引，会转为0

substr() (已废弃，不推荐)

1
2
3
let str = 'Hello World';
str.substr(0, 5);   // 'Hello' (起始位置, 长度)
str.substr(-5, 3);  // 'Wor'

split() - 分割为数组

1
2
3
4
5
6
7
let str = 'a,b,c,d';
str.split(',');      // ['a', 'b', 'c', 'd']
str.split(',', 2);   // ['a', 'b'] (限制数量)
str.split('');       // ['a', ',', 'b', ',', 'c', ',', 'd']

// 正则分割
'a1b2c3'.split(/\d/);  // ['a', 'b', 'c', '']

3. 替换和修改

replace()

1
2
3
4
5
6
7
8
9
10
11
12
13
let str = 'Hello World';

// 替换第一个
str.replace('o', '0');     // 'Hell0 World'

// 正则替换所有
str.replace(/o/g, '0');    // 'Hell0 W0rld'

// 忽略大小写
str.replace(/world/i, 'JS');  // 'Hello JS'

// 回调函数
'abc'.replace(/./g, (char, index) => char.toUpperCase());  // 'ABC'

replaceAll()

1
2
let str = 'aabbcc';
str.replaceAll('b', 'x');  // 'aaxxcc'

trim() / trimStart() / trimEnd()

1
2
3
4
let str = '  Hello World  ';
str.trim();       // 'Hello World'
str.trimStart();  // 'Hello World  '
str.trimEnd();    // '  Hello World'

padStart() / padEnd() - 填充

1
2
3
'5'.padStart(3, '0');   // '005'
'5'.padEnd(3, '0');     // '500'
'abc'.padStart(6, '-'); // '---abc'

repeat() - 重复

1
'ab'.repeat(3);  // 'ababab'

4. 大小写转换

1
2
3
4
5
6
let str = 'Hello World';

str.toUpperCase();       // 'HELLO WORLD'
str.toLowerCase();       // 'hello world'
str.toLocaleUpperCase(); // 本地化大写
str.toLocaleLowerCase(); // 本地化小写

5. 其他方法

charAt() / charCodeAt() / codePointAt()

1
2
3
4
5
6
7
let str = 'Hello';
str.charAt(0);       // 'H'
str.charCodeAt(0);   // 72 (ASCII码)

// Unicode
'😀'.codePointAt(0);  // 128512
String.fromCodePoint(128512);  // '😀'

concat()

1
'Hello'.concat(' ', 'World');  // 'Hello World'

at() - 索引访问（支持负索引）

1
2
3
let str = 'Hello';
str.at(0);   // 'H'
str.at(-1);  // 'o'

normalize() - Unicode 规范化

1
'\u0041\u030A'.normalize('NFC');  // 'Å'

三、对象方法 (Object Methods)

1. 键值操作

Object.keys() - 获取所有键

1
2
let obj = { a: 1, b: 2, c: 3 };
Object.keys(obj);  // ['a', 'b', 'c']

Object.values() - 获取所有值

1
2
let obj = { a: 1, b: 2, c: 3 };
Object.values(obj);  // [1, 2, 3]

Object.entries() - 获取键值对数组

1
2
3
4
5
6
7
let obj = { a: 1, b: 2 };
Object.entries(obj);  // [['a', 1], ['b', 2]]

// 遍历
for (let [key, value] of Object.entries(obj)) {
  console.log(`${key}: ${value}`);
}

Object.fromEntries() - 键值对数组转对象

1
2
3
4
5
6
let entries = [['a', 1], ['b', 2]];
Object.fromEntries(entries);  // { a: 1, b: 2 }

// 配合 Map
let map = new Map([['a', 1], ['b', 2]]);
Object.fromEntries(map);  // { a: 1, b: 2 }

2. 对象操作

Object.assign() - 合并对象

1
2
3
4
5
6
7
8
9
let target = { a: 1 };
let source1 = { b: 2 };
let source2 = { c: 3 };

Object.assign(target, source1, source2);
console.log(target);  // { a: 1, b: 2, c: 3 }

// 浅拷贝
let copy = Object.assign({}, target);

展开运算符 (…) - 合并/拷贝

1
2
3
4
5
let obj1 = { a: 1, b: 2 };
let obj2 = { c: 3, d: 4 };

let merged = { ...obj1, ...obj2 };  // { a: 1, b: 2, c: 3, d: 4 }
let copy = { ...obj1 };  // 浅拷贝

Object.freeze() - 冻结对象

1
2
3
4
let obj = { a: 1 };
Object.freeze(obj);
obj.a = 2;  // 静默失败（严格模式报错）
console.log(obj.a);  // 1

Object.seal() - 密封对象

1
2
3
4
5
let obj = { a: 1 };
Object.seal(obj);
obj.a = 2;    // 可以修改
obj.b = 3;    // 不能添加
delete obj.a; // 不能删除

Object.isFrozen() / Object.isSealed()

1
2
3
let obj = {};
Object.freeze(obj);
Object.isFrozen(obj);  // true

3. 属性描述符

Object.getOwnPropertyDescriptor()

1
2
3
let obj = { a: 1 };
Object.getOwnPropertyDescriptor(obj, 'a');
// { value: 1, writable: true, enumerable: true, configurable: true }

Object.defineProperty()

1
2
3
4
5
6
7
let obj = {};
Object.defineProperty(obj, 'a', {
  value: 1,
  writable: false,
  enumerable: true,
  configurable: false
});

Object.defineProperties()

1
2
3
4
5
let obj = {};
Object.defineProperties(obj, {
  a: { value: 1, writable: true },
  b: { value: 2, writable: false }
});

4. 原型操作

Object.create() - 创建对象

1
2
3
let proto = { greet() { return 'Hello'; } };
let obj = Object.create(proto);
obj.greet();  // 'Hello'

Object.getPrototypeOf() / Object.setPrototypeOf()

1
2
3
4
5
let obj = {};
Object.getPrototypeOf(obj) === Object.prototype;  // true

let proto = { a: 1 };
Object.setPrototypeOf(obj, proto);

5. 检测方法

hasOwnProperty() - 自有属性检测

1
2
3
let obj = { a: 1 };
obj.hasOwnProperty('a');         // true
obj.hasOwnProperty('toString');  // false (继承属性)

Object.hasOwn() (ES2022)

1
2
let obj = { a: 1 };
Object.hasOwn(obj, 'a');  // true

in 操作符 - 包含继承属性

1
2
3
let obj = { a: 1 };
'a' in obj;         // true
'toString' in obj;  // true (继承属性)

Object.is() - 严格相等比较

1
2
3
Object.is(NaN, NaN);   // true (=== 返回 false)
Object.is(0, -0);      // false (=== 返回 true)
Object.is(1, 1);       // true

四、数字方法 (Number Methods)

常用方法

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
// 转换
Number('123');        // 123
Number('12.34');      // 12.34
Number('abc');        // NaN
parseInt('123.45');   // 123
parseFloat('123.45'); // 123.45
parseInt('0xFF', 16); // 255 (指定进制)

// 检测
Number.isNaN(NaN);           // true
Number.isFinite(123);        // true
Number.isInteger(123.0);     // true
Number.isSafeInteger(123);   // true

// 格式化
let num = 123.456789;
num.toFixed(2);           // '123.46' (四舍五入到小数点后2位)
num.toPrecision(4);       // '123.5' (4位有效数字)
num.toExponential(2);     // '1.23e+2' (科学计数法)
num.toString(16);         // '7b' (转16进制字符串)
num.toLocaleString('zh-CN'); // '123.457' (本地化格式)

// 常量
Number.MAX_VALUE;         // 最大值
Number.MIN_VALUE;         // 最小正值
Number.MAX_SAFE_INTEGER;  // 最大安全整数 (2^53 - 1)
Number.MIN_SAFE_INTEGER;  // 最小安全整数
Number.POSITIVE_INFINITY; // 正无穷
Number.NEGATIVE_INFINITY; // 负无穷

五、Math 对象方法

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
// 常量
Math.PI;      // 3.141592653589793
Math.E;       // 2.718281828459045

// 取整
Math.round(4.5);   // 5 (四舍五入)
Math.floor(4.9);   // 4 (向下取整)
Math.ceil(4.1);    // 5 (向上取整)
Math.trunc(4.9);   // 4 (截断小数)

// 绝对值和符号
Math.abs(-5);      // 5
Math.sign(-5);     // -1 (返回 -1, 0, 1)

// 最值
Math.max(1, 2, 3); // 3
Math.min(1, 2, 3); // 1
Math.max(...[1, 2, 3]);  // 数组求最值

// 幂和根
Math.pow(2, 3);    // 8
Math.sqrt(16);     // 4
Math.cbrt(27);     // 3 (立方根)
Math.hypot(3, 4);  // 5 (勾股定理)

// 对数
Math.log(Math.E);  // 1 (自然对数)
Math.log10(100);   // 2
Math.log2(8);      // 3

// 随机数
Math.random();                          // [0, 1) 随机数
Math.floor(Math.random() * 10);         // 0-9 随机整数
Math.floor(Math.random() * (max - min + 1)) + min;  // min-max 随机整数

// 三角函数
Math.sin(Math.PI / 2);  // 1
Math.cos(0);            // 1
Math.tan(Math.PI / 4);  // 1
Math.asin(1);           // π/2
Math.acos(1);           // 0
Math.atan(1);           // π/4
Math.atan2(1, 1);       // π/4

六、日期方法 (Date Methods)

创建日期

1
2
3
4
5
6
new Date();                    // 当前时间
new Date('2024-01-15');        // 解析字符串
new Date(2024, 0, 15);         // 年月日 (月份从0开始!)
new Date(2024, 0, 15, 10, 30); // 年月日时分
new Date(1705276800000);       // 时间戳(毫秒)
Date.now();                    // 当前时间戳

获取方法

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
let d = new Date('2024-01-15 10:30:45');

d.getFullYear();     // 2024
d.getMonth();        // 0 (0-11，0是一月)
d.getDate();         // 15 (日期)
d.getDay();          // 1 (星期，0是周日)
d.getHours();        // 10
d.getMinutes();      // 30
d.getSeconds();      // 45
d.getMilliseconds(); // 0
d.getTime();         // 时间戳(毫秒)

// UTC 版本
d.getUTCFullYear();
d.getUTCMonth();
// ...

设置方法

1
2
3
4
5
6
7
8
9
let d = new Date();

d.setFullYear(2025);
d.setMonth(5);        // 设为6月
d.setDate(20);
d.setHours(14);
d.setMinutes(30);
d.setSeconds(0);
d.setTime(timestamp);

格式化方法

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
let d = new Date('2024-01-15 10:30:45');

d.toString();        // 完整字符串
d.toDateString();    // 'Mon Jan 15 2024'
d.toTimeString();    // '10:30:45 GMT+0800'
d.toISOString();     // '2024-01-15T02:30:45.000Z'
d.toJSON();          // 同 toISOString
d.toLocaleDateString('zh-CN');  // '2024/1/15'
d.toLocaleTimeString('zh-CN');  // '10:30:45'
d.toLocaleString('zh-CN');      // '2024/1/15 10:30:45'

// 自定义格式化
d.toLocaleString('zh-CN', {
  year: 'numeric',
  month: '2-digit',
  day: '2-digit',
  hour: '2-digit',
  minute: '2-digit',
  weekday: 'long'
});

七、JSON 方法

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
// 对象转 JSON 字符串
let obj = { name: '张三', age: 25 };
let jsonStr = JSON.stringify(obj);
// '{"name":"张三","age":25}'

// 格式化输出
JSON.stringify(obj, null, 2);  // 2空格缩进

// 自定义序列化
JSON.stringify(obj, ['name']);  // 只序列化 name
JSON.stringify(obj, (key, value) => {
  if (key === 'age') return undefined;  // 排除 age
  return value;
});

// JSON 字符串转对象
let parsed = JSON.parse(jsonStr);
// { name: '张三', age: 25 }

// 转换处理
JSON.parse(jsonStr, (key, value) => {
  if (key === 'age') return value + 1;
  return value;
});

八、正则表达式常用方法

RegExp 方法

1
2
3
4
5
6
7
8
let regex = /hello/gi;

// test() - 检测是否匹配
regex.test('Hello World');  // true

// exec() - 详细匹配信息
let result = /(\d+)-(\d+)/.exec('2024-01');
// ['2024-01', '2024', '01', index: 0, ...]

字符串配合正则

1
2
3
4
5
6
7
8
9
10
11
12
13
let str = 'Hello World';

// match() - 匹配
str.match(/o/g);      // ['o', 'o']

// search() - 搜索位置
str.search(/World/);  // 6

// replace() - 替换
str.replace(/o/g, '0');  // 'Hell0 W0rld'

// split() - 分割
'a1b2c3'.split(/\d/);   // ['a', 'b', 'c', '']

九、实用技巧

数组去重

1
2
3
4
5
6
// 方法1: Set
let arr = [1, 2, 2, 3, 3, 3];
let unique = [...new Set(arr)];

// 方法2: filter
let unique2 = arr.filter((item, index) => arr.indexOf(item) === index);

数组扁平化

1
2
let arr = [1, [2, [3, [4]]]];
arr.flat(Infinity);  // [1, 2, 3, 4]

对象深拷贝

1
2
3
4
5
// 简单方式（有局限性）
let copy = JSON.parse(JSON.stringify(obj));

// structuredClone (现代浏览器)
let copy2 = structuredClone(obj);

数组分组

1
2
3
4
5
6
7
8
// Object.groupBy (ES2024)
let people = [
  { name: '张三', age: 20 },
  { name: '李四', age: 25 },
  { name: '王五', age: 20 }
];
Object.groupBy(people, p => p.age);
// { 20: [{...}, {...}], 25: [{...}] }

防抖和节流

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
// 防抖
function debounce(fn, delay) {
  let timer;
  return function(...args) {
    clearTimeout(timer);
    timer = setTimeout(() => fn.apply(this, args), delay);
  };
}

// 节流
function throttle(fn, interval) {
  let lastTime = 0;
  return function(...args) {
    let now = Date.now();
    if (now - lastTime >= interval) {
      lastTime = now;
      fn.apply(this, args);
    }
  };
}

参考资料

×