js方法總結(jié)與數(shù)組去重

1 數(shù)組去重方法

1.1 Set方法去重

let arr=[...new Set(arr)]

1.2 雙重循環(huán)

Array.prototype.unique = function(){
  cost newArray=[];
  let isRepeat;
  for(let i = 0; i < this.length; i++){
    isRepeat = false;
    for(let j = 0; j < newArray.length; j++){
      if(this[i] === newArray[j]){
        isRepeat = true;
        bread;
}
}
if(!isRepeat){
    newArray.push(this[i])
}
  }
return newArray;
}

1.3 Array.prototype.indexOf()實現(xiàn)去重

基本思路：如果索引不是第一個索引，說明是重復(fù)值

  • 利用Array.prototype.filter()過濾功能
  • Array.prototype.indexOf()返回的是第一個索引值
  • 只將數(shù)組中元素第一次出現(xiàn)的返回
  • 之后出現(xiàn)的將被過濾掉
// 第一種方式
Array.prototype.unique = function(){
  return this.filter((item, index) => {
    return this.indexOf(item) === index;
  })
}

// 第二種方式
Array.prototype.unique = function () {
  const newArray = [];
  this.forEach(item => {
    if (newArray.indexOf(item) === -1) {
      newArray.push(item);
    }
  });
  return newArray;
}

1.4 Array.prototype.includes()方式去重

Array.prototype.unique = function () {
  const newArray = [];
  this.forEach(item => {
    if (!newArray.includes(item)) {
      newArray.push(item);
    }
  });
  return newArray;
}

1.5 Array.prototype.reduce()方式去重

Array.prototype.unique = function () {
  return this.sort().reduce((init, current) => {
    if(init.length === 0 || init[init.length - 1] !== current){
      init.push(current);
    }
    return init;
  }, []);
}

2 技巧總結(jié)

2.1 判斷對象的數(shù)據(jù)類型

注意傳入 type 參數(shù)時首字母大寫
const isType = (type)=>{
    return target =>{
        return `[object ${type}]` == Object.prototype.toString.call(target)
    }
}

// 判斷數(shù)組
const isArray = isType('Array');
console.log(isArray([])); //true

// 判斷對象
const isObject = isType('Object');
console.log(isArray({})); //true

2.2 JS字符串常用方法總結(jié)

  1. toLowerCase(): 把字符串轉(zhuǎn)為小寫，返回新的字符串。
var str="Hello World";
var str1=str.toLowerCase();
console.log(str); //Hello World
console.log(str1); //hello world
  1. toUpperCase(): 把字符串轉(zhuǎn)為大寫，返回新的字符串。
var str="hello world";
var str1=str.toUpperCase();
console.log(str); //hello world
console.log(str1); //HELLO WORLD
  1. charAt(): 返回指定下標(biāo)位置的字符。如果index不在0-str.length(不包含str.length)之間，返回空字符串。
var str="hello world";
var str1=str.charAt(6);
console.log(str1);//w
  1. charCodeAt(): 返回指定下標(biāo)位置的字符的unicode編碼,這個返回值是 0 - 65535 之間的整數(shù).
    注意：如果index不在0-str.length(不包含str.length)之間，返回NaN。
var str="hello world";
var str1=str.charCodeAt(1);
var str2=str.charCodeAt(-2); //NaN
console.log(str1); //101
  1. indexOf(): 返回某個指定的子字符串在字符串中第一次出現(xiàn)的位置
    注意：indexOf()方法對大小寫敏感，如果子字符串沒有找到，返回-1。第二個參數(shù)表示從哪個下標(biāo)開始查找，沒有寫則默認(rèn)從下標(biāo)0開始查找
var str="Hello World";
var str1=str.indexOf("o");
var str2=str.indexOf("world");
var str3=str.indexOf("o",str1+1);
console.log(str1); //4 默認(rèn)只找第一個關(guān)鍵字位置，從下標(biāo)0開始查找
console.log(str2); //-1 沒有找到
console.log(str3); //7
  1. lastIndexOf(): 返回某個指定的子字符串在字符串中最后出現(xiàn)的位置
    注意：lastIndexOf()方法對大小寫敏感，如果子字符串沒有找到，返回-1。第二個參數(shù)表示從哪個下標(biāo)開始查找，沒有寫則默認(rèn)從最后一個字符處開始查找。
var str="Hello World";
var str1=str.lastIndexOf("o");
var str2=str.lastIndexOf("world");
var str3=str.lastIndexOf("o",str1-1);
console.log(str1); //7
console.log(str2); //-1
console.log(str3); //4
  1. slice(): 返回字符串中提取的子字符串。
    注意：
  • 如果只有一個參數(shù)，則提取開始下標(biāo)到結(jié)尾處的所有字符串
  • 兩個參數(shù)，則提取第一個參數(shù)（包含）到第二個參數(shù)（不包含）之間的字符
  • 如果是負(fù)數(shù)，-1為字符串的最后一個字符
var str="Hello World";
var str1=str.slice(2); //如果只有一個參數(shù)，則提取開始下標(biāo)到結(jié)尾處的所有字符串
var str2=str.slice(2,7); //兩個參數(shù)，提取下標(biāo)為2，到下標(biāo)為7但不包含下標(biāo)為7的字符串
var str3=str.slice(-7,-2); //如果是負(fù)數(shù)，-1為字符串的最后一個字符。提取從下標(biāo)-7開始到下標(biāo)-2但不包含下標(biāo)-2的字符串。前一個數(shù)要小于后一個數(shù)，否則返回空字符串

console.log(str1); //llo World
console.log(str2); //llo W
console.log(str3); //o Wor
  1. substring(): 提取字符串中介于兩個指定下標(biāo)之間的字符
    注意：
  • 參數(shù)不接受負(fù)數(shù)，其余和slice一樣
var str="Hello World";
var str1=str.substring(2)
var str2=str.substring(2,2);
var str3=str.substring(2,7);
console.log(str1); //llo World
console.log(str2); //如果兩個參數(shù)相等，返回長度為0的空串
console.log(str3); //llo W
  1. substr(): 返回從指定下標(biāo)開始指定長度的的子字符串
    注意：
  • 如果沒有指定length,返回從下標(biāo)開始處結(jié)尾處的所有字符串。
var str="Hello World";
var str1=str.substr(1)
var str2=str.substr(1,3);
var str3=str.substr(-3,2);
console.log(str1); //ello World 
console.log(str2); //ell
console.log(str3); //rl
  1. split(): 把字符串分割成字符串?dāng)?shù)組。
var str="AA BB CC DD";
var string1="1:2:3:4:5";
var str1=str.split("");//如果把空字符串 ("")用作分割符，那么字符串的每個字符之間都會被分割
var str2=str.split(" "); //以空格為分隔符
var str3=str.split("",4); //4指定返回數(shù)組的最大長度
var str4=string1.split(":");
console.log(str1); // ["A", "A", " ", "B", "B", " ", "C", "C", " ", "D", "D"]
console.log(str2); //["AA" "BB" "CC" "DD"]
console.log(str3); //["A", "A", " ", "B"]
console.log(str4); // ["1", "2", "3", "4", "5"]
  1. replace(): 在字符串中用一些字符替換另一些字符，或替換一個與正則表達式匹配的子串。
var str="hello WORLD";
var reg=/o/ig; //o為要替換的關(guān)鍵字，不能加引號，否則替換不生效，i忽略大小寫，g表示全局查找。
var str1=str.replace(reg,"**")
console.log(str1); //hell** W**RLD

12.match(): 返回所有查找的關(guān)鍵字內(nèi)容的數(shù)組。

var str="To be or not to be";
var reg=/to/ig;
var str1=str.match(reg);
console.log(str1); //["To", "to"]
console.log(str.match("Hello")); //null

2.3 js中數(shù)組常用方法總結(jié)

  1. Array.map 此方法是將數(shù)組中的每個元素調(diào)用一個提供的函數(shù)，結(jié)果作為一個新的數(shù)組返回，并沒有改變原來的數(shù)組
    let arr = [1, 2, 3, 4, 5]
    let newArr = arr.map(x => x*2)
    //arr= [1, 2, 3, 4, 5]   原數(shù)組保持不變
    //newArr = [2, 4, 6, 8, 10] 返回新數(shù)組
  1. Array.forEach() 此方法是將數(shù)組中的每個元素執(zhí)行傳進提供的函數(shù)，沒有返回值，注意和map方法區(qū)分
   let arr = [1, 2, 3, 4, 5]
   num.forEach(x => x*2)
   // arr = [1, 2, 3, 4, 5]  數(shù)組改變,注意和map區(qū)分
  1. Array.filter() 此方法是將所有元素進行判斷，將滿足條件的元素作為一個新的數(shù)組返回
    let arr = [1, 2, 3, 4, 5]
    const isBigEnough = value = value >= 3
    let newArr = arr.filter(isBigEnough )
    //newNum = [3, 4, 5] 滿足條件的元素返回為一個新的數(shù)組
  1. Array.every() 此方法是將所有元素進行判斷返回一個布爾值，如果所有元素都滿足判斷條件，則返回true，否則為fals
    let arr = [1, 2, 3, 4, 5]
    const isLessThan4 = value => value < 4
    const isLessThan6 => value => value < 6
    arr.every(isLessThan4 ) //false
    arr.every(isLessThan6 ) //true
  1. Array.some() 此方法是將所有元素進行判斷返回一個布爾值，如果存在元素都滿足判斷條件，則返回true,若所有元素都不滿足，則返回false
    let arr= [1, 2, 3, 4, 5]
    const isLessThan4 = value => value < 4
    const isLessThan6 = value => value > 6
    arr.some(isLessThan4 ) //true
    arr.some(isLessThan6 ) //false
  1. Array.reduce() 此方法是所有元素調(diào)用返回函數(shù)，返回值為最后結(jié)果,傳入的值必須是函數(shù)類型
    let arr = [1, 2, 3, 4, 5]
   const add = (a, b) => a + b
   let sum = arr.reduce(add,0)// 累加
  1. Array.push() 此方法是在數(shù)組的后面添加新加元素，此方法改變了數(shù)組的長度：
    let arr = [1, 2, 3]
    arr.push(4)
    console.log(arr) //[1, 2, 3, 4]
    console.log(arr.length) //4
  1. Array.unshift() 此方法是將一個或多個元素添加到數(shù)組的開頭，并返回新數(shù)組的長度：
    let arr = [1, 2, 3, 4, 5]
    arr.unshift(6, 7)
    console.log(arr) //[6, 7, 1, 2, 3, 4, 5]
    console.log(arr.length) //7
  1. Array.pop() 此方法在數(shù)組后面刪除最后一個元素，并返回數(shù)組，此方法改變了數(shù)組的長度：
    let arr = [1, 2, 3, 4, 5]
    arr.pop()
    console.log(arr) //[1, 2, 3, 4]
    console.log(arr.length) //4
  1. Array.shift() 此方法在數(shù)組后面刪除第一個元素，并返回數(shù)組，此方法改變了數(shù)組的長度：
    let arr = [1, 2, 3, 4, 5]
    arr.shift()
    console.log(arr) //[2, 3, 4, 5]
    console.log(arr.length) //4
  1. Array.isArray() 判斷一個對象是不是數(shù)組，返回的是布爾值
let arr  = [];
console.log(Array.isArray(arr));// true
  1. Array.concat() 此方法是一個可以將多個數(shù)組拼接成一個數(shù)組
let arr1 = [1, 2, 3]
  arr2 = [4, 5]
  let arr = arr1.concat(arr2)
  console.log(arr)//[1, 2, 3, 4, 5]
  1. Array.toString() 此方法將數(shù)組轉(zhuǎn)化為字符串：
let arr = [1, 2, 3, 4, 5];
   let str = arr.toString()
   console.log(str)// 1,2,3,4,5
  1. Array.join() 此方法也是將數(shù)組轉(zhuǎn)化為字符串：
let arr = [1, 2, 3, 4, 5];
   let str1 = arr.toString()
   let str2 = arr.toString(',')
   let str3 = arr.toString('##')
   console.log(str1)// 12345
   console.log(str2)// 1,2,3,4,5
   console.log(str3)// 1##2##3##4##5
  1. Array.splice(開始位置， 刪除的個數(shù)，元素) 萬能方法，可以實現(xiàn)增刪改
    let arr = [1, 2, 3, 4, 5];
     let arr1 = arr.splice(2, 0 'haha')
     let arr2 = arr.splice(2, 3)
     let arr1 = arr.splice(2, 1 'haha')
     console.log(arr1) //[1, 2, 'haha', 3, 4, 5]新增一個元素
     console.log(arr2) //[1, 2] 刪除三個元素
     console.log(arr3) //[1, 2, 'haha', 4, 5] 替換一個元素
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點，簡書系信息發(fā)布平臺，僅提供信息存儲服務(wù)。

友情鏈接更多精彩內(nèi)容