1 array

Array deduplicating (three methods)

Method 1: Arr. ForEach


function unique(arr) {
  //1 declares an empty array to store
  const res = []
  //2 iterate over the original array
  arr.forEach(item= >{
    //3 Determine if the element is in the array res
    if (res.indexOf(item) === -1) {//4 If no, insert into res
      res.push(item)
    }
  })
  // 5 Returns the result
  return res
}
Copy the code

Method two: arr. ForEach + empty object

function unique2(arr) {
  //1 declares an empty array to store
  const res = []
  //2 declare empty object,
  const obj = {}
  //3 Iterate over the original array
  arr.forEach(item= >{
    / / 5
    if (obj[item] === undefined) {//4 ArR traversal item as subscript obj{} is convenient
      obj[item] = true
      res.push(item)
    }
  })
  //6 Returns the result
  return res
}
Copy the code

Method three: Set, using Set itself to remove the function

function unique3(arr) {
  // Convert an array to a Set, using the Set's own de-duplication function
  let set = new Set(arr)
  // Expand set to create an array
  let array = [...set]
  return array
}

Copy the code

// Method 3 (simplification) :
function unique4(arr) {
  return [... new Set(arr)]
}

console.log(unique4([1.2.2.4.3.2]))
Copy the code

Concat array merge

function concat(arr,... args){
  //1 declares the empty array, and presses the arR number into the res
  const res =  [...arr]
  //2
  args.forEach(item= >{
    //3 Check whether item is an array
    if (Array.isArray(item)) {
      / / 4... Item is a deconstructed assignment that puts the elements of the item array into res one by oneres.push(... item) }else {
      res.push(item)
    }
  })
  //5 Returns the result
  return res
}

console.log(concat(arr,[4.5.6].7.8.9))

Copy the code

Slice array slice

/*
* @param {Array} arr
* @param {Number} start
* @param {Number} begin
*
* */
function slice(arr,start,end){
  //5 Add a check to see if the arr length is 0
  if (arr.length === 0) {
    return[]}// 6 check start, if passed, it is start, or 0
  start = start || 0
  //7 If start is out of bounds, an empty array is returned
  if (start >= arr.length){
    return[]}//8 Check end, if passed, end, or default array length
  end = end || arr.length
  //9 If end is less than start, the array length is given to end
  if (end < start){
    end = arr.length
  }

  //1 declares an empty array, slice returns a new array
  const res = []
  //2 iterate over the object
  for(var i = 0; i < arr.length; i++){
    //3 Check whether the position of I in array is valid
    if (i >= start & i < end) {
      // add the subscript element to res[]
      res.push(arr[i])
    }
  }
  //10 Returns the result
  return res
}



let arr = [1.2.3.4.5.6.7.8]
const res = slice(arr,3.6)
console.log(res)


// let res = arr.slice(1,4)// slice array 2-4
Copy the code

Array flattening (two methods)

(Multidimensional array > one-dimensional array)

Method 1: Use recursion (operating on an array)

function flatten1(arr){
// 1 declares an empty array
  let res = []
  //2
  arr.forEach(item= >{
    //3 Check whether item is an array
    if (Array.isArray(item)) {
      //4 item is an array
      // and join with res[]
      // reassign
      res = res.concat(flatten1(item))
    } else {
      //5 If item is not an array
      // reassign
      res = res.concat(item)
    }
  })
//6 Returns the result
  return res
}
Copy the code

Method two, use some, new array

function flatten2(arr){
  //1 declares the array
  let res = [...arr]
  //2
  //some returns true if one of the array conditions is met
  while (res.some(item= >Array.isArray(item))){
    / / res = [] concat ([1, 2, [3, 4, [5, 6]], 7])
    [1,2,3,4,[5,6],7]
    [1,2,3,4,5,6,7]res = [].concat(... res) }//3 Returns the result
  return res
}


let arr = [1.2[3.4[5.6]],7]
console.log(flatten2(arr))
Copy the code

Array partitioning (1-d array > 2-D array)

function chunk(arr,size=1){
  / / 7 judgment
  if (arr.length === 0) {return[]}//1 declare two variables
  let res = []
  let tmp = []// TMP []
  / / 2 traversal
  arr.forEach(item= >{
    //4 Check whether the length of TMP is 0
    if (tmp.length == 0) {
      //5 Press TMP into res[]
      res.push(tmp)
    }
    //3 Press the element into TMP
    tmp.push(item)
    // 6 Check whether the TMP array is size. If yes, clear it
    if (tmp.length === size){
      tmp = []
    }
  })
  // 8 Returns the result
  return res
}

console.log(chunk([1.2.3.4.5.6.7].4))
Copy the code

Array difference set:

API: filter, traversal, and filter through array 1, compare array 2

function diff(arr1,arr2=[]){
  //2 Determine parameters
  if (arr1.length === 0) {
    return[]}//3 Determine parameters
  if (arr2.length === 0) {
    return  arr1.slice()Slice returns a new array
  }
  // 1 filter, traversal, and filter
  const res = arr1.filter(item= >! arr2.includes(item))return res
}

console.log(diff([1.2.4.5], [5.6.8]))
Copy the code

Delete an element from an array (old array or new array)

The original array

Splice changes the length of the array so that when you subtract one element, all subsequent elements move forward, reducing I accordingly

function removeWithoutCopy(arr, item) {
  for(var i = 0; i < arr.length; i++){
    if (item == arr[i]){
   // splice changes the size of the array. When you subtract one element, all subsequent elements move forward, so you need to reduce I accordingly
      arr.splice(i,1) i--; }}return arr
}
Copy the code

New array (two methods) filter

Method one: the filter

function remove2(arr, item) {
  return arr.filter(function (a) {
    returna ! = item }) }Copy the code

Method two: brute force crack

function remove1(arr, item) {
  var arr1 = []
  for(var i = 0; i < arr.length; i++){
    if(arr[i] ! = item) {// if arr[I] is not equal to item, add the array a
      arr1.push(arr[i])
    }
  }
  return arr1
}
Copy the code

Removes some elements from the array

API: pull (array,… The value)

function pull(arr,... args) {
  //1 declares an empty array to hold the deleted elements
  const res = []
  // 2 traverses arr
  for(var i = 0; i < arr.length; i++){    //3 Check if I is in arg array
    if(args.includes(arr[i])){
      //4 pass arr[I] to res[]
      res.push(arr[i])
      Delete / / 5 arr [I]
      arr.splice(i,1)//splice can change the original array
      //6 subscript decrement
      i--
    }
  }
  / / 7 to return
  return res

}

function pullAll(arr,values) {
  returnpull(arr,... values) } arr = [1.2.3.4.5.6]
/ / the console. The log (phinomena) (arr, 1, four, five)
// console.log(arr)
console.log(pullAll(arr,[2.3.4]))
console.log(arr)
Copy the code

Get the elements of the array

Filter changes the original array to produce a new array

function drop(arr,size) {
  //filter filters the original array to generate a new array
  return arr.filter((value ,index) = >{
    return index >= size
  })
}

function dropRights(arr,size){
  return arr.filter((value ,index) = >{
    return  index < arr.length-size
  })
}
console.log(drop([1.24.5.6].2))
console.log(dropRights([1.24.5.6].2))
Copy the code

2 Array.prototype.XXX

Map, evaluates, returns a new array

const arr = [1.2.3.4]
const map1 = arr.map(x= > x*2)
console.log(map1)//[2, 4, 6, 8]
Copy the code

Principle:

function map(arr,callback) {
  // 1 declares an empty array
  let res = []
  //2
  for (let i = 0; i <arr.length ; i++) {
    //3 Perform the callback
    res.push(callback(arr[i],i))
  }
  // 4 Returns the result
  return res
}


const arr = [1.2.3.4]

// Map function call
const res = map(arr,(item,index) = > {
  return item * 2
})

console.log(res)//[2, 4, 6, 8]
Copy the code

Reduce callback, register, return

const arr = [1.2.3.4]

let res = arr.reduce(function (res,value) {
// Where res is the register, the default is 0
  return res + value
},0)

console.log(res)/ / 10
Copy the code

Packaging principle:

function reduce(arr,callback,initValue) {
  // Declare variables
  let res = initValue
  // loop over
  for (let i = 0; i <arr.length ; i++) {
    // Perform a callback and assign to res, the scratcher
    res = callback(res, arr[i])
  }
  // Return the result
  return res
}

const arr = [1.2.3.4]
// Call the reduce function
let res = reduce(arr, function (res,value) {
  return res + value
},10)

console.log(res)/ / 20
Copy the code

Filter Returns a new array

Const arr = [1,2,3,4] // Return odd number of const res = arr.filter(item=> item % 2 === = 1) console.log(res)//[1, 3]Copy the code

Principle:

function filter(arr,callback) {
  // 1 declares an empty array
  let res = []
  //2
  for (let i = 0; i <arr.length ; i++) {
    //3 Perform the callback
    let a = (callback(arr[i],i))
    //4 Check whether the callback function is true
    if (a) {
      res.push(arr[i])
    }
  }
  // 4 Returns the result
  return res
}


const arr = [1.2.3.4]
// Return the odd number in the original array
const res = filter(arr,item= > item % 2= = =1)

console.log(res)//[ 1, 3 ]
Copy the code

Every satisfies true, otherwise false

const arr = [1.2.3.4]
const res = arr.every(item= > item > 2)
console.log(res)//false
Copy the code

Principle:

function every(arr,callback) {
  //1
  for (let i = 0; i <arr.length ; i++) {
    //2 Perform the callback
    let res =callback(arr[i],i)
    //3 Check whether the callback condition is met (reverse judgment)
    if(! res){/ / returns false
      return false}}// 4 If the criteria are met, return true
  return true
}


const arr = [1.2.3.4]

const res = every(arr,(item,index) = > {
  return item > 2
})
console.log(res)//false
Copy the code

Some is true if it has one; otherwise, false

Const arr = [1,2,3,4] const res = arr.some(item=> item > 2) console.log(res)//trueCopy the code

Principle:

Function some(arr,callback) {// some(arr,callback); i <arr.length ; If (res){// if (res){// if (res){// if (I){// if (I){// if (I){// if (I){// if (I){// if (I){// if (I){// if (I){ Return false return false} const arr = [1,2,3,4] const res = some(arr,(item,index)=> {return item > 2}) console.log(res)//trueCopy the code

Find finds the first true value in the array, otherwise undefined

Const arr = [1,2,3,4] const res = arr.find(item=> item > 2) console.log(res)//3Copy the code

The principle of

function find(arr,callback) {
  //1
  for (let i = 0; i <arr.length ; i++) {
    //2 Perform the callback
    let res =callback(arr[i],i)
    / / 3
    if (res){
      // Returns the element currently being traversed
      return arr[i]
    }
  }
  // 4 Return undefined if the criteria are not met
  return undefined
}


const arr = [1.2.3.4]

const res = find(arr,(item,index) = > {
  return item > 2
})
console.log(res)/ / 3
Copy the code

FindIndex is similar to find in that it returns an index true, or -1 otherwise

Const arr = [1,7,2,9,4] const res = arr.findIndex(item=> item > 6) console.log(res)//1Copy the code

Principle:

function findIndex(arr,callback) {
  //1
  for (let i = 0; i <arr.length ; i++) {
    //2 Perform the callback
    let res =callback(arr[i],i)
    / / 3
    if (res){
      // Returns the index of the element being traversed
      return i
    }
  }
  // 4 does not meet the criteria, return -1
  return -1
}


const arr = [1.7.2.9.4]

const res = findIndex(arr,(item,index) = > {
  return item > 2
})
console.log(res)/ / 1
Copy the code

3. Functional correlation

Call, change the direction of this

function call(Fn,obj,... args) {
  / / 4
  if (obj === undefined || obj === null){
    obj = globalThis// Global objects
  }
  //1 Add temporary methods for obj
  obj.temp = Fn// This points to the same thing
  // 2 Call the temp method
  letres = obj.temp(... args)//3 Delete the temp method
  delete obj.temp
  // Returns the execution result
  return res
}

Copy the code


// declare a function
function add(a,b) {
  console.log(this)
  return a + b + this.c
}
// Declare an object
let obj = {
  c:200
}
// Add global attributes
// window.c = 123

// Execute the call function
console.log(call(add,obj,10.20))
/ / the console. The log (call) (add, null, 1, 2)
Copy the code

Apply changes this to an array

function apply(Fn,obj,args) {
  / / 4
  if (obj === undefined || obj === null){
    obj = globalThis// Global objects
  }
  //1 Add temporary methods for obj
  obj.temp = Fn
  // 2 Call the temp method
  letres = obj.temp(... args)//3 Delete the temp method
  delete obj.temp
  // Returns the execution result
  return res
}
Copy the code

// declare a function
function add(a,b) {
  console.log(this)
  return a + b + this.c
}
// Declare an object
let obj = {
  c:200
}
// Add global attributes
// window.c = 123

// Execute the function
console.log(apply(add,obj,[10.20]))
/ / the console. The log (the apply (add, null, [1, 2]))
Copy the code

bind

Like call, bind does not execute functions, but creates new ones

function bind(Fn,obj,... args) {
  // Return the new function
  return function (. args2) {
    // Execute the call function
    returncall(Fn, obj,... args,... args2) } }Copy the code


// declare a function
function add(a,b) {
  console.log(this)
  return a + b + this.c
}
// Declare an object
let obj = {
  c:200
}
// Add global attributes
// window.c = 123

// Execute the function

let fn = bind(add,obj,3.4)
console.log(fn(1.2))
Copy the code

mo4tech.com (Moment For Technology) is a global community with thousands techies from across the global hang out!Passionate technologists, be it gadget freaks, tech enthusiasts, coders, technopreneurs, or CIOs, you would find them all here.

JavaScript data structures and Algorithms (for beginners)

1 array

Array deduplicating (three methods)

Concat array merge

Slice array slice

Array flattening (two methods)

Array partitioning (1-d array > 2-D array)

Array difference set:

Delete an element from an array (old array or new array)

The original array

New array (two methods) filter

Removes some elements from the array

Get the elements of the array

2 Array.prototype.XXX

Map, evaluates, returns a new array

Reduce callback, register, return

Filter Returns a new array

Every satisfies true, otherwise false

Some is true if it has one; otherwise, false

Find finds the first true value in the array, otherwise undefined

FindIndex is similar to find in that it returns an index true, or -1 otherwise

3. Functional correlation

Call, change the direction of this

Apply changes this to an array

bind

JavaScript data structures and Algorithms (for beginners)

1 array

Array deduplicating (three methods)

Concat array merge

Slice array slice

Array flattening (two methods)

Array partitioning (1-d array > 2-D array)

Array difference set:

Delete an element from an array (old array or new array)

The original array

New array (two methods) filter

Removes some elements from the array

Get the elements of the array

2 Array.prototype.XXX

Map, evaluates, returns a new array

Reduce callback, register, return

Filter Returns a new array

Every satisfies true, otherwise false

Some is true if it has one; otherwise, false

Find finds the first true value in the array, otherwise undefined

FindIndex is similar to find in that it returns an index true, or -1 otherwise

3. Functional correlation

Call, change the direction of this

Apply changes this to an array

bind

Related Posts

Vue realizes that the PC end calls the camera to take photos and record the face, and the mobile end calls the front camera of the mobile phone to record the face, and the picture rotation correction, compression upload base64 format/file format

How to internationalize the front end (Middle)

A year and a half into the business, first time taking over Shit Mountain