算法刷题 JavaScript 工具手册

文章目录

• [算法刷题 JavaScript 工具手册](#算法刷题 JavaScript 工具手册)
• [一、Array 数组常用操作](#一、Array 数组常用操作)
• • [1.1 尾部插入或者删除元素 push / pop](#1.1 尾部插入或者删除元素 push / pop)
  • [1.2 头部插入或者删除元素 unshift/shift](#1.2 头部插入或者删除元素 unshift/shift)
  • [1.3 返回一个新数组 map](#1.3 返回一个新数组 map)
  • [1.4 过滤数组filter](#1.4 过滤数组filter)
  • [1.5 把数组压缩成一个值reduce](#1.5 把数组压缩成一个值reduce)
  • [1.6 原数组就地排序sort](#1.6 原数组就地排序sort)
  • [1.7 从数组中截取一段并返回新数组 slice](#1.7 从数组中截取一段并返回新数组 slice)
  • [1.8 插入替换删除原数组splice](#1.8 插入替换删除原数组splice)
• [二、Map 映射常用操作](#二、Map 映射常用操作)
• • [2.1 创建一个映射](#2.1 创建一个映射)
  • [2.2 添加一条映射 set](#2.2 添加一条映射 set)
  • [2.3 根据 key 值找到 value get](#2.3 根据 key 值找到 value get)
  • [2.4 判断这条映射是否存在 has](#2.4 判断这条映射是否存在 has)
  • [2.5 根据 key值删除这条映射 delete](#2.5 根据 key值删除这条映射 delete)
  • [2.6 获取映射条数 size](#2.6 获取映射条数 size)
  • [2.7 清空映射 clear](#2.7 清空映射 clear)
  • [2.8 遍历映射](#2.8 遍历映射)
• [三、Set 映射常用操作](#三、Set 映射常用操作)
• [四、Math 常用函数](#四、Math 常用函数)
• • [4.1 取整函数 Math.floor() 向下取整](#4.1 取整函数 Math.floor() 向下取整)
  • [4.2 取整函数 Math.ceil() 向上取整](#4.2 取整函数 Math.ceil() 向上取整)
  • [4.3 四舍五入 Math.round()](#4.3 四舍五入 Math.round())
  • [4.4 取最大值 取最小值 Math.max() Math.min()](#4.4 取最大值 取最小值 Math.max() Math.min())
  • [4.5 取绝对值 Math.abs()](#4.5 取绝对值 Math.abs())
• 五、字符串操作
• • [5.1 获取字符串长度](#5.1 获取字符串长度)
  • [5.2 字符串是否包含某个字符](#5.2 字符串是否包含某个字符)
  • [5.3 字符串的截取](#5.3 字符串的截取)
  • [5.4 字符串的替换,替换第一个和全局替换](#5.4 字符串的替换,替换第一个和全局替换)
  • [5.5 字符串分割 split](#5.5 字符串分割 split)
  • [5.5 字符串拼接 join](#5.5 字符串拼接 join)
  • [5.6 大小写转换](#5.6 大小写转换)
  • [5.7 去空格](#5.7 去空格)

算法刷题 JavaScript 工具手册

一、Array 数组常用操作

1.1 尾部插入或者删除元素 push / pop

arr.push(x) // 尾部插入
arr.pop()   // 删除尾部

返回值:

• push 返回的是数组的长度

• pop 返回的是删除的那个元素

举例如下:

const arr = [1,2,3,4,5,6,7,8,9,10];
console.log(arr);
arr.push(11);
console.log(arr);
arr.pop();
console.log(arr);

console.log(arr.push(12));
console.log(arr.pop());

输出结果如下:

[
  1, 2, 3, 4,  5,
  6, 7, 8, 9, 10
]
[
   1, 2, 3, 4,  5,
   6, 7, 8, 9, 10,
  11
]
[
  1, 2, 3, 4,  5,
  6, 7, 8, 9, 10
]
11
12

• 首先加入 11,然后抛出 11,加入 12,打印的是数组的长度,值为 11,取到的抛出的元素 12

1.2 头部插入或者删除元素 unshift/shift

arr.unshift(x) // 头部插入
arr.shift()    // 删除头

返回值:

• unshift 返回的是数组的长度

• shift 返回的是删除的那个元素

举例如下:

arr.unshift(0);
console.log(arr);
arr.shift();
console.log(arr);

console.log(arr.unshift(-1));
console.log(arr.shift());

输出结果如下:

[
   0, 1, 2, 3, 4,
   5, 6, 7, 8, 9,
  10
]
[
  1, 2, 3, 4,  5,
  6, 7, 8, 9, 10
]
11
-1

1.3 返回一个新数组 map

arr.map(x => x * 2)

回调函数传入参数:

arr.map((item, index, array) => {})

参数	含义
item	当前元素
index	当前下标
array	原数组

举例说明:

const arr = [10, 20, 30]

arr.map((item, index, array) => {
  console.log(item, index, array)
})

输出：

10 0 [10,20,30]
20 1 [10,20,30]
30 2 [10,20,30]

---

思考:回调函数

也就是我们给 map 传入了一个函数,map 中帮我实现很多东西,而从拿到了某些参数,我们再使用

以普通函数为例的模拟:

function myMap<T, U>(
  arr: T[],
  callback: (item: T, index: number, array: T[]) => U
): U[] {
  const result: U[] = []

  for (let i = 0; i < arr.length; i++) {
    const item = arr[i]

    const mapped = callback(item, i, arr)

    result.push(mapped)
  }

  return result
}

• callback 就是那个函数,我们传入的函数就是对应给的这里
• 因为这个只是普通函数的模拟,不考虑第一个传入的参数 原数组arr,真是实现使用了原型原型链,第一个参数arr 并不是作为参数传入,而是作为 this 绑定到函数内部

---

返回值:

• 返回一个新数组

举例如下:

const arr1=[1,2,3];
const arr2=arr1.map(x=>x*2);
console.log(arr2);

输出结果如下:

[ 2, 4, 6 ]

1.4 过滤数组filter

传入参数:同 map

返回值:

• 返回一个新数组

举例如下:

取一个数组的奇数,组成一个新的数组

const arr3=[1,2,3,4,5,6,7,8,9,10];
const arr4=arr.filter(x=>x%2!=0);
console.log(arr4);

输出结果如下:

[ 1, 3, 5, 7, 9 ]

filter 和 map 的区别?

return 的意义不同

举例来说:

const arr = [1,2,3,4]
arr.map(x => x > 2)
[false, false, true, true]

arr.filter(x => x > 2)
[3,4] 只保存 true 项

1.5 把数组压缩成一个值reduce

传入参数:

arr.reduce((acc, cur, index, array) => {
  return 新的acc
}, 初始值)

参数	含义
acc	累加器（上一次的结果）
cur	当前元素
index	下标
array	原数组

返回值:

• 返回一个值,reduce 的返回值类型 = acc（累加器）的类型
• 每一轮 return 的值 = 下一轮的 acc

举例如下:数组求和

const arr=[10,20,30];
const result=arr.reduce((acc,cur)=>{return acc+=cur;},5);
console.log(result);

输出结果如下:

65

1.6 原数组就地排序sort

默认是字典序排序:

[3, 1, 10, 2].sort()
结果是[1, 10, 2, 3]

传入参数:

arr.sort((a, b) => ...)

• 传入一个比较函数,比较函数里面有两个参数(a,b),比较的是 a 和 b的相对顺序,类似于不断的拿出来两个值,不断比较
• sort 的规则,sort 不关心类型，只关心你 return 的值是不是：负数 / 正数 / 0,意味着小的在前
• < 0 → a 在前
• > 0 → b 在前
• = 0 → 不变
• 根据 js 引擎,底层的使用什么排序算法不一定

返回值:

• 返回就是原数组,因为修改是原地修改原数组

举例如下:

const arr=[8,5,1,2,3,66,44,55];
arr.sort((a,b)=>a-b);
console.log(arr);
arr.sort((a,b)=>{return b-a});
console.log(arr);

输出结果如下:

[
  1,  2,  3,  5,
  8, 44, 55, 66
]
[
  66, 55, 44, 8,
   5,  3,  2, 1
]

1.7 从数组中截取一段并返回新数组 slice

传入参数

arr.slice(start, end)

参数	含义
start	起始下标（包含）
end	结束下标（不包含）

返回值:

• 返回新数组

举例如下:

const arr = [1, 2, 3, 4, 5]
arr.slice(1, 4)

输出结果如下:

[2, 3, 4]

从 index=1 开始（包含）到 index=4 结束（不包含）

常见用法:

1.复制数组

const copy = arr.slice()
等价于,
const copy = [...arr]

2.截取到末尾

arr.slice(2)

从 index=2 到最后

3.取最后两个元素,负数 = 从后往前数

arr.slice(-2)

小练习:

const arr = [1, 2, 3, 4, 5]
arr.slice(-3, -1)

//结果是
数组长度为 5,-1 对应 4,-2 对应 3,-3 对应 2
arr.slice(-3, -1)就是arr.slice(2, 4)
包含 2 不包含4
[3,4]

1.8 插入替换删除原数组splice

传入参数:

arr.splice(start, deleteCount, ...items)

• start（从哪开始动手）:开始操作的位置（下标）
• deleteCount:删除几个元素
• ...items（可选）:要插入的新元素,可以不写 / 写多个

返回值:

• 注意原数组被修改

• 被删除的元素数组

举例如下:

1.纯删除

arr.splice(1, 2)
// 从 index=1 开始，删 2 个

2.插入（不删除）

arr.splice(1, 0, 100)
//在 index=1 插入 100

3.替换

arr.splice(1, 1, 99)
删 1 个 → 再放 99

二、Map 映射常用操作

Map：一种"键值对集合"，但 key 可以是任意类型,Object 的 key 只能是string / symbol

初始化输入输出数据格式

[[key, value], [key, value]]

2.1 创建一个映射

const map = new Map()

2.2 添加一条映射 set

map.set('a', 1)
map.set('b', 2)

2.3 根据 key 值找到 value get

map.get('a') // 1

2.4 判断这条映射是否存在 has

map.has('a') // true

2.5 根据 key值删除这条映射 delete

map.delete('a')

2.6 获取映射条数 size

map.size // 元素个数

2.7 清空映射 clear

map.clear()

2.8 遍历映射

1.for...of

for (const [key, value] of map) {
  console.log(key, value)
}

2.forEach

map.forEach((value, key) => {
  console.log(key, value)
})

注意:value 在前，key 在后

三、Set 映射常用操作

set 初始化输入输出格式

[value, value, value]

使用方法同 Map

如何给数组去重?

const arr = [...new Set(nums)]

四、Math 常用函数

Math.max()
Math.min()
Math.abs()
Math.floor()
Math.ceil()
Math.round()

4.1 取整函数 Math.floor() 向下取整

向更小的方向取整

Math.floor(3.9)  // 3
Math.floor(-3.1) // -4 

4.2 取整函数 Math.ceil() 向上取整

向更大的方向取整

Math.ceil(3.1)  // 4
Math.ceil(-3.9) // -3 ❗

4.3 四舍五入 Math.round()

Math.round(3.5) // 4
Math.round(3.4) // 3

4.4 取最大值 取最小值 Math.max() Math.min()

Math.max(1, 5, 3) // 5
Math.min(1, 5, 3) // 1

4.5 取绝对值 Math.abs()

 Math.abs(-5) // 5

五、字符串操作

首先明确,因为字符串是不可变的,所以返回的都是新值

5.1 获取字符串长度

str.length

5.2 字符串是否包含某个字符

'hello'.includes('e') // true

5.3 字符串的截取

start, end) 左闭右开

'hello'.slice(1, 4) // 'ell'

5.4 字符串的替换,替换第一个和全局替换

• replace 替换第一个

  'hello'.replace('l', 'x') // 'hexlo'

• 全局替换

  'hello'.replaceAll('l', 'x') // 'hexxo'

5.5 字符串分割 split

返回值:

• 字符数组

  'a,b,c'.split(',') // ['a','b','c']

5.5 字符串拼接 join

['a','b','c'].join('-') // 'a-b-c'

组合使用实例:

'hello world'.split(' ').join('-')
// 'hello-world'

5.6 大小写转换

str.toUpperCase()
str.toLowerCase()

5.7 去空格

str.trim()        // 两边
str.trimStart()   // 左
str.trimEnd()     // 右