js常见用法

1、String扩展

实例方法：includes(), startsWith(), endsWith()

传统上，JavaScript 只有indexOf方法，可以用来确定一个字符串是否包含在另一个字符串中。ES6 又提供了三种新方法。

includes()：返回布尔值，表示是否找到了参数字符串。
startsWith()：返回布尔值，表示参数字符串是否在原字符串的头部。
endsWith()：返回布尔值，表示参数字符串是否在原字符串的尾部。

let s = 'Hello world!';

s.startsWith('Hello') // true
s.endsWith('!') // true
s.includes('o') // true

这三个方法都支持第二个参数，表示开始搜索的位置。

let s = 'Hello world!';

s.startsWith('world', 6) // true
s.endsWith('Hello', 5) // true
s.includes('Hello', 6) // false

上面代码表示，使用第二个参数n时，endsWith的行为与其他两个方法有所不同。它针对前n个字符，而其他两个方法针对从第n个位置直到字符串结束。

2、Array的函数用法

A、比较两个数组的差异

对比两个数组的差异，将差异合成新数组

数值

const getArrDifference = (arr1, arr2) => {
  return arr1.concat(arr2).filter((v, i, arr) =>  arr.indexOf(v) === arr.lastIndexOf(v))
};
const list = [1, 2, 3, 4, 5]
const list2 = [1, 2, 3, 5]
const list3 = [1, 3, 5]
const list4 = [1, 2, 4]
console.log(getArrDifference(list,list2)); //[4]
console.log(getArrDifference(list3.list4));//[3,5,2,4]

对象

const getArrDifference = (arr1, arr2) => {
  return arr1.concat(arr2).filter((item, i, arr) => arr.findIndex(x => x.id === item.id) === arr.findLastIndex(x => x.id === item.id))
};
const list = [{id:1},{id:3},{id:4,as:34}]
const list2 = [{id:1},{id:3},{id:1}]
console.log(getArrDifference(list,list2)); //[{id:4,as:34}]

B、获取两个数组的重复值

对比两个数组的重复值，将重复值合成新数组

数值

const getData = (arr1, arr2) => {
  return arr1.filter(x=>arr2.some(y=>x===y))
};
const list = [1, 2, 3, 4, 5]
const list2 = [1, 2, 3, 5]
console.log(getData(list,list2)); // [1, 2, 3, 5]

对象

const getData = (arr1, arr2) => {
  return arr1.filter(x=>arr2.some(y=>x.id===y.id))
};
const list = [{id:1},{id:3},{id:4,as:34}]
const list2 = [{id:1},{id:3},{id:5}]
console.log(getData(list,list2)); //[{id:1},{id:3}]

C、两个数组去重

两个数组合并，过滤出重复的数组，组成新数组

数值

const getData = (arr1, arr2) => {
  return arr1.concatarr2 filter(x=>arr2.some(y=>x===y))
};
const list = [1, 2, 3, 4, 5]
const list2 = [1, 2, 3, 5]
console.log(getData(list,list2)); // [1, 2, 3, 5]

对象

const getData = (arr1, arr2) => {
  return arr1.filter(x=>arr2.some(y=>x.id===y.id))
};
const list = [{id:1},{id:3},{id:4,as:34}]
const list2 = [{id:1},{id:3},{id:5}]
console.log(getData(list,list2)); //[{id:1},{id:3}]

D、使用函数过滤html

1、使用filter和map过滤

let data=`<div class="sd"><span>   A: 0  </span><span> B: 0 </span> <span>  C: 0  </span></div>`
const res=data.replace(/<[^>]+>/g, '').split('\n').filter(x => x.trim()).map(x => x.trim()).join('\n')
console.log(res)
//'A: 0\nB: 0\nC: 0'

2、使用reduce过滤

 data.replace(/<[^>]+>/g, '').split('\n').reduce((obj, item) => {
	     if (item.trim()) obj.push(item.trim())
	     return obj
 }, []).join('\n')
//或者换成这种
//return data.replace(/<[^>]+>/g, '').split('\n').reduce((obj, item) => { if (item.trim()) { obj += item.trim() + '\n' } return obj })

E、重新组合数据（两列重新组合数据）

要求：[1,2，3,4，5,6，7,8，9,10,11,12] 组合成 [[1,2],[3,4],[5,6],[7,8],[9,10],[11,12]]

//for
 const arr = [] 
 const min_arr = []
for (let i = 0; i < res.list.length; i++) {
	  if (i % 2 === 0) {
	     min_arr = [res.list[i]]
	   } else {
	     min_arr.push(res.list[i])
	     arr.push(min_arr)
	   }
 }
//reduce
const arr2 = res.list.reduce((sum, num, index) => {
        if (index % 2 === 0) {
             sum.push([num])
           } else {
             sum[sum.length - 1].push(num)
           }
           return sum
 }, [])