「🦆TSK的博客」

Appearance

On this page

数组 ​

some ​

如果用一个空数组进行测试，在任何情况下它返回的都是 false

join ​

一个所有数组元素连接的字符串。如果 arr.length 为0，则返回空字符串。
⭐如果一个元素为 undefined 或 null，它会被转换为空字符串。

默认使用逗号链接

splice ​

array.splice( start, [deleteCount], [item1,item2,item3,....] )

months.splice(3); // 就意味着 把下标为 3 以后的全部删除

TIP

start 可以是负数,等价于 array.length - start

下标 ​

数组用 字符串 存储下标

slice ​

返回的是一个新数组，是一个左闭右开区间

js
let arr = [1,2,3]
let r =  arr.slice(2);
r // [3]
js
let arr = [1,2,3]
let r =  arr.slice(0,2);
r // [1,2]
js
let arr = [1,2,3]
let r =  arr.slice(0,-1);
r // [1,2]

解构 ​

本质是迭代器, 对象身上没有迭代器,构建一个迭代器
js
let obj = {x:1,y:2}

obj[Symbol.iterator] = function*() {
  yield this.x;
  yield this.y;
}

let [x,y] = obj;
console.log(x,y); // 1,2

迭代器 ​

迭代器的好处是它提供了一种标准的遍历机制，可以适用于各种不同类型的数据结构。

它为遍历过程提供了统一的界面，使得代码更加简洁和可读性更强。
同时，自定义迭代器对象也可以使我们灵活地控制遍历的顺序和方式

js
let colors = ['red', 'green', 'blue'];

let iterator = colors[Symbol.iterator](); // 获取迭代器对象

let nextItem = iterator.next();

while (!nextItem.done) {
  console.log(nextItem.value);
  nextItem = iterator.next();
}

除了 for...of 循环和手动遍历，迭代器还可以与其他 JavaScript 内置函数和方法一起使用，例如 Array.from()、spread 操作符等

TIP

也就是说 forof 需要一个迭代器对象,迭代器是一个对象，而迭代器对象可以通过 Symbol.iterator 属性来获取。

迭代器对象是指 {value:"xxxx",done:true/false }

js
let array = [1, 2, 3, 4, 5];

Array.prototype[Symbol.iterator] = function () {
  let currentIndex = 0;
  return {
    next: () => {
      if (currentIndex < this.length) {
        return {
          value: this[currentIndex++],
          done: false
        };
      } else {
        return { done: true };
      }
    }
  };
}

for (const iterator of array) {
  console.log(iterator);
}

在对象上添加 Symbol.iterator 属性

js
Object.prototype[Symbol.iterator] = function () {
  return Object.values(this)[Symbol.iterator]()
}
js
let obj = {
  name: 'xiaoming',
  age: 18
}

for (const iterator of obj) {
  // 'xiaoming' 18
  console.log(iterator)
}


let x = Array.from(obj)
// [ 'xiaoming', 18 ]
console.log(x)

或者把上文中的Array 换成 Object

sort ​

排序函数接受两个参数 a 和 b，代表要进行比较的两个元素。

  • 当返回值为负数时，表示 a 应该排在 b 前面
  • 当返回值为正数时，表示 a 应该排在 b 后面
  • 当返回值为零时，表示 a 和 b 相等，顺序保持不变。
compareFn(a, b) 返回值排序顺序
> 0a 在 b 后，如 [b, a]
< 0a 在 b 前，如 [a, b]
=== 0保持 a 和 b 原来的顺序
js
let arr = [1,4,3];

arr.sort((a,b)=>{
  return a - b;
})
// [1,3,4]
  1. a 等于 1,b 等于 4,a - b = -3,返回值是负数, 所以 1 在 4 前面
  2. a 等于 4,b 等于 3,a - b = 1,返回值是正数, 所以 4 在 3 后面

对象数组排序 ​

js
const items = [
  { name: "Edward", value: 21 },
  { name: "Sharpe", value: 37 },
  { name: "And", value: 45 },
  { name: "The", value: -12 },
  { name: "Magnetic", value: 13 },
  { name: "Zeros", value: 37 },
];

// 根据 value 排序
items.sort((a, b) => a.value - b.value);

// 根据 name 排序
items.sort((a, b) => {
  const nameA = a.name.toUpperCase(); // 忽略大小写
  const nameB = b.name.toUpperCase(); // 忽略大小写

  if (nameA < nameB) {
    return -1;
  }

  if (nameA > nameB) {
    return 1;
  }

  // name 必须相等
  return 0;
});

🔗flatMap ​

flatMap() 方法对数组中的每个元素应用给定的回调函数，然后将结果展开一级，返回一个新数组。

它等价于在调用 map() 方法后再调用深度为 1 的 flat() 方法

js
const arr1 = [1, 2, 1];

const result = arr1.flatMap((num) => (num === 2 ? [2, 2] : 1));

console.log(result);
// Expected output: Array [1, 2, 2, 1]

在 map() 方法过程中添加和删除元素 ​

flatMap 方法可以用作在 map 方法中添加和删除元素（修改元素数量）的方法

  • 如果要保留该项，则返回一个包含该项的单元素数组
  • 如果要添加元素，则返回一个包含多个元素的数组
  • 如果要删除该项，则返回一个空数组
js
// 假设我们想要删除所有负数，并将奇数拆分成偶数和 1
const a = [5, 4, -3, 20, 17, -33, -4, 18];
//         |\  \  x   |  | \   x   x   |
//        [4,1, 4,   20, 16, 1,       18]

const result = a.flatMap((n) => {
  if (n < 0) {
    return [];
  }
  return n % 2 === 0 ? [n] : [n - 1, 1];
});

console.log(result); // [4, 1, 4, 20, 16, 1, 18]

会展开

js
const arr = [1, 2, [4, 5], 6, 7, [8]] ;

console.log(arr.flatMap((element) => element)); 
// output :[1, 2, 4, 5, 6, 7, 8]