JavaScript 对象、数组和字符串方法全面总结

更新: 9/4/2025字数: 0 字 时长: 0 分钟

一、对象(Object)方法

1. Object.is()

判断两个值是否相同，与 === 类似，但处理了 NaN 和 ±0 的特殊情况。

console.log(Object.is("foo", "foo")); // true
console.log(Object.is(window, window)); // true
console.log(Object.is(NaN, NaN)); // true
console.log(Object.is(0, -0)); // false

2. Object.assign()

用于合并对象，将源对象属性复制到目标对象。

const target = { a: 1, b: 2 };
const source = { b: 4, c: 5 };
const result = Object.assign(target, source);

console.log(target); // { a: 1, b: 4, c: 5 }
console.log(result); // { a: 1, b: 4, c: 5 }

3. Object.entries() / Object.fromEntries()

对象与键值对数组互相转换。

const obj = { foo: "bar", baz: 42 };
console.log(Object.entries(obj)); // [ ['foo', 'bar'], ['baz', 42] ]

const entries = [
  ["0", "a"],
  ["1", "b"]
];
console.log(Object.fromEntries(entries)); // { 0: 'a', 1: 'b' }

4. Object.values()

返回对象可枚举属性值的数组。

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

5. hasOwnProperty()

检查对象是否包含特定自有属性。

const obj = { a: 1 };
console.log(obj.hasOwnProperty("a")); // true
console.log(obj.hasOwnProperty("toString")); // false (继承属性)

6. Object.keys()

返回对象可枚举属性名的数组。

const obj = { a: 1, b: 2 };
console.log(Object.keys(obj)); // ['a', 'b']

7. toString()

返回对象的字符串表示。

const obj = { a: 1 };
console.log(obj.toString()); // '[object Object]'
console.log([1, 2].toString()); // '1,2'

8. Object.freeze()

冻结对象，防止修改。

const obj = { prop: 42 };
Object.freeze(obj);
obj.prop = 33; // 静默失败或严格模式下报错
console.log(obj.prop); // 42

9. Object.create()

使用现有对象作为新对象的原型。

const person = { isHuman: false };
const me = Object.create(person);
me.name = "Matthew";
console.log(me.isHuman); // false

二、数组(Array)方法

改变原数组的方法

1. push() / pop()

const arr = [1, 2];
arr.push(3); // 返回新长度3
console.log(arr); // [1, 2, 3]
arr.pop(); // 返回3
console.log(arr); // [1, 2]

2. unshift() / shift()

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

3. splice()

const arr = [1, 2, 3, 4];
arr.splice(1, 2, "a", "b"); // 返回[2,3]
console.log(arr); // [1, 'a', 'b', 4]

4. sort() / reverse()

const arr = [3, 1, 4, 2];
arr.sort(); // [1, 2, 3, 4]
arr.reverse(); // [4, 3, 2, 1]

5. fill()

const arr = [1, 2, 3];
arr.fill(0, 1); // 从索引1开始填充0
console.log(arr); // [1, 0, 0]

6. copyWithin()

const arr = [1, 2, 3, 4, 5];
arr.copyWithin(0, 3); // 复制索引3开始的元素到索引0
console.log(arr); // [4, 5, 3, 4, 5]

不改变原数组的方法

1. concat() / slice()

const arr1 = [1, 2];
const arr2 = arr1.concat([3, 4]); // [1, 2, 3, 4]
const arr3 = arr2.slice(1, 3); // [2, 3]

2. join() / toString()

const arr = [1, 2, 3];
console.log(arr.join("-")); // '1-2-3'
console.log(arr.toString()); // '1,2,3'

3. indexOf() / lastIndexOf() / includes()

const arr = [1, 2, 3, 2];
console.log(arr.indexOf(2)); // 1
console.log(arr.lastIndexOf(2)); // 3
console.log(arr.includes(3)); // true

4. find() / findIndex()

const arr = [5, 12, 8, 130];
console.log(arr.find((x) => x > 10)); // 12
console.log(arr.findIndex((x) => x > 10)); // 1

5. filter() / map() / reduce()

const arr = [1, 2, 3];
console.log(arr.filter((x) => x > 1)); // [2, 3]
console.log(arr.map((x) => x * 2)); // [2, 4, 6]
console.log(arr.reduce((a, b) => a + b)); // 6

6. some() / every()

const arr = [1, 2, 3];
console.log(arr.some((x) => x > 1)); // true
console.log(arr.every((x) => x > 1)); // false

7. flat() / flatMap()

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

8. Array.from() / Array.of()

console.log(Array.from("foo")); // ['f', 'o', 'o']
console.log(Array.of(1, 2, 3)); // [1, 2, 3]

三、字符串(String)方法

1. 基本方法

const str = "Hello World";

console.log(str.charAt(1)); // 'e'
console.log(str.concat("!")); // 'Hello World!'
console.log(str.includes("Hello")); // true
console.log(str.indexOf("o")); // 4
console.log(str.lastIndexOf("o")); // 7

2. 截取方法

const str = "Hello World";

console.log(str.slice(0, 5)); // 'Hello'
console.log(str.substring(6)); // 'World'
console.log(str.substr(6, 3)); // 'Wor'

3. 大小写转换

console.log("hello".toUpperCase()); // 'HELLO'
console.log("WORLD".toLowerCase()); // 'world'

4. 替换与分割

const str = "Hello World";

console.log(str.replace("World", "JavaScript")); // 'Hello JavaScript'
console.log(str.split(" ")); // ['Hello', 'World']

5. 去除空格

const str = "  hello  ";
console.log(str.trim()); // 'hello'
console.log(str.trimStart()); // 'hello  '
console.log(str.trimEnd()); // '  hello'

6. 其他方法

const str = "Hello World";

console.log(str.search("World")); // 6
console.log(str.repeat(2)); // 'Hello WorldHello World'
console.log("abc".padStart(5, "1")); // '11abc'
console.log("abc".padEnd(5, "1")); // 'abc11'

7. 模板字符串

const name = "John";
console.log(`Hello ${name}`); // 'Hello John'
console.log(`Sum: ${1 + 2}`); // 'Sum: 3'

四、Set 和 Map

1. Set

const set = new Set([1, 2, 3, 4, 4]);
console.log([...set]); // [1, 2, 3, 4]
set.add(5);
console.log(set.has(5)); // true
set.delete(1);
console.log(set.size); // 4

2. Map

const map = new Map();
map.set("name", "John");
map.set("age", 30);

console.log(map.get("name")); // 'John'
console.log(map.has("age")); // true
map.delete("age");
console.log(map.size); // 1