An array of

Poor array

A sparse array with an empty value in it is called a sparse array

// 1 The array will contain empty when we delete the item
var arr = [1.2.3.4.5]
delete arr[1]
console.log(arr) => [1, empty, 3.4.5]
// We see empty values in the array
// 2 When we put extra commas in the array, ' 'will also appear empty
var arr = [1.3.4.5]
console.log(arr) => [1, empty, 3.4.5]
// We see a null value in the array
// Of course it prints undefined instead of empty when we try to call it
console.log(arr[1]) = >undefined 
// Because when we call arr[I] we call it without assigning the property of the object if this property returns no value undefined
Copy the code

An array of class

Class arrays and arrays

  • What is a class array
    • Class array haslengthProperty, and we find the class arraykeyThere is a corresponding sequence
    • Class arrays are objects, our common class arraysThe arguments ` ` DOMLIST ` ` string
    • The difference between the length of an array and the length of a string: The length of an array can be changed, the length of a string cannot be changed, and the length of a string is read-only
    • An array of classes is an object that can’t call any of the methods on the array prototype for exampleforEach

Traversal iterators and generator iterators

What is ergodic?

  1. Traversal is querying and processing each element in an array

What is an iteration

  1. We want the traversal process to be controlled (traversal process can stop, can continue), manual control of the traversal
  2. Traversal is implemented iteratively over and over again

The generator

  1. A generator is a function. Add ***** to the function name in js
  2. The iteration of a generator is defined byyieldcontrolled

The iterator

  1. Is an object with a next method returned after execution by the generator

Array methods

There are a lot of methods on the array and when we printed the array we saw that there were a lot of methods on his prototype

  1. A method for converting a string

    toString (join= > split)
Copy the code

  2. The stack method

    push pop unshift shift
Copy the code

  3. Rank correlation method

    Reverse sort sort randomlyCopy the code

  4. Stitching method

    concat
Copy the code

  5. Deletion method

    slice splice
Copy the code

  6. To find the way

    indexOf lastIndexOf includes 
Copy the code

  7. Method to create an array

    Array() the fill fillArray.of() a single valueArrayForm () class array to arrayCopy the code

  8. Lookup item method

    find findIndex
Copy the code

  9. Traversal methods

    Array.prototype.keys Array.prototype.values Array. Prototype. Entires correspondingObject.keys Object.values Object.entries 
forEach
map
filter
some
every
find
findIndex
Copy the code

  10. Inductive function

    reduce 
Copy the code

  • The generic method toString

    • ToString converts an array to a string and returns it. You can pass a multidimensional array directly to a string
    var arr = [1.2.3.4.5.6.7]
var str = arr.toSTring()
var str = Array.prototype.toString.call(arr)
console.log(str) => 1.2.3.4.5.6.7
// It can also be converted to toSTring if it is a multi-dimensional array
Copy the code

  • join split

    • Join converts an array to a string and returns, if there is no value in the argument, according to, if there is a value in the argument, according to the value of the argument, and cannot convert multidimensional arrays
    • The split method, which corresponds to join, converts a string to an array, either directly if there are no arguments, or by arguments if there are
    var arr = [1The [[2].3.4.5.6.7]]
var str = arr.join()
console.log(str) => 1.2.3.4.5.6.7
var str = arr.join(The '-')
console.log(str) => 1-2.3.4.5.6.7
// We find that the join can split only one level of the array
// Of course, there are properties in the string to split the string into arrays
var str = '123456'
var arr = str.split(' ')
console.log(arr) => [1.2.3.4.5.6]
Copy the code

  • push pop unshift shift

    • Push an item from the end of the array to a number of items, and return a value that changes the length of the array. If you push something other than an array, you have length, and you increment the length by one bit. If you don’t, you increment the length by zero
    • Pop removes an item from the end of the array and the return value of the deleted item changes the original array
    • Unshift increments one or more items from the start of an array, changing the length of the array
    • Shift removes an item from the start of the array and returns the value of the deleted item to change the original array
    // push returns value => Increases the length of the array
// pop Return value => deleted item
// unshift returns value => Increases the length of the array
// Shift returns value => Deleted item
var arr = [1.2.3.4]
console.log(arr.push(10)) = >5=> Increase the length of the arrayconsole.log(arr) => [1.2.3.4.10]
console.log(arr.pop()) => 10=> Delete the itemconsole.log(arr) => [1.2.3.4]
console.log(arr.unshift(10)) = >5=> Increase the length of the arrayconsole.log(arr) => [10.1.2.3.4]
console.log(arr.shift()) => 10=> Delete the itemconsole.log(arr) => [1.2.3.4]
Copy the code

  • reverse sort

    • The reverse method changes the array. The reverse method reverses the order of the array and changes it
    • Sort changes the array, returns the sorted order according to the callback function, returns the sorted array if you don’t pass the callback function sort by asII code, and compares it bit by bit from left to right
    • Based on the in situ algorithm, the algorithm is different for each browser
    • If it’s less than 0 it’s on the left, if it’s greater than 0 it’s on the right, and if it’s 0 it doesn’t move
    // reverse returns the value => the original array in reverse order
// sort returns value => the sorted array
var arr = [1.2.3.4]
console.log(arr,arr.reverse() === arr) // true 
console.log(arr,arr.sort() === arr) // true
Copy the code

  • concat

    • Concat Concatenates dimensions to one dimension if an array is passed in. Concatenates parameters to the end of the array and returns a new array
    // concat returns the value => concatenated array
var arr = [1.2.3]
console.log(arr,arr.concat(1.2)) = > [1.2.3] [1.2.3.1.2]
console.log(arr,arr.concat([1.2= > []))1.2.3] [1.2.3.1.2]
console.log(arr,arr.concat([[1], [2) = > []])1.2.3] [1.2.3[1], [2]] 
// concat cannot remove multiple dimensions from arrays
// We often use... Operator to concatenate arrays
console.log(arr,[...arr,1.2= > [])1.2.3] [1.2.3.1.2]
Copy the code

  • slice

    • The slice method returns the array cut without changing the original array. If a negative number is passed, the length + parameter must be smaller than the second parameter. The first parameter is start and the second parameter is end
    // [) start end
// Slice returns a sliced array of values
var arr  = [1.2.3.4.5]
console.log(arr,arr.slice(2)) // [1, 2, 3,4,5] [3,4,5]
console.log(arr, arr.slice(3.4)) // [1, 2, 3, 4, 5]
console.log(arr, arr.slice(4.2)) // [1, 2, 3, 4, 5]
console.log(arr, arr.slice(-3, -1)) // [1, 2, 3, 4, 5] [3, 4]
// We can convert an array of classes to an array

var str = 'dshakhjdskah'
console.log(Array.prototype.slice.call(str)); // ["d", "s", "h", "a", "k", "h", "j", "d", "s", "k", "a", "h"]

function fn() {
    console.log(Array.prototype.slice.call(arguments));
}
fn(1.2.3.4.5.6.7)
Copy the code

  • splice

    • The splice method cannot use negative numbers as arguments. The first argument is start, the second argument is count, and the third argument is the number of arguments that need to be added to the array
    • If only one argument is passed, the array is cut, and the array is cut starting with a subscript of several
    • If two arguments are passed, the number of bits to be cut from the array, the number of bits to be cut when the second argument is passed, and the array to be cut when the value is returned
    • If three or more are passed, the array is cut from the subscript to the number of bits, and the array is cut when the third and subsequent parameters are returned from the subscript
    // splice modifies the array
// splice can pass a negative number as the first argument
// splice second argument passed invalid value negative return [] empty array
// splice the return value of an argument deletes the original array from the passed index and returns the new array deleted to the end [)
// splice removes the array from the index and returns the new array. The second argument is length
// splice The return value of two or more arguments after the second argument is inserted into the original array at the index position passed in
var arr = [1.2.3.4.5.6.7]
// console.log(arr, arr.splice(1));
// console.log(arr, arr.splice(1, 2));
// console.log(arr, arr.splice(-3, -1))
console.log(arr, arr.splice(0.0.6.6.6.6))
Copy the code

  • indexOf lastIndexOf

    // indexOf returns a value from the left to the first index if the value is found in the array
var arr = [1.2.3.4.5]
console.log(arr.indexOf(1)) / / = > 0
// lastIndexOf returns the first index from the right if the value is found in the array or -1 if not
var arr = [1.2.3.4.5.1]
console.log(arr.lastIndexOf(1)) / / = > 5
// includes returns true if it is in the array false if it is not
var arr = [1.2.3.4.5.1]
console.log(arr.includes(1)) // => true
//////////////Includes returns a Boolean value. IndexOf returns an index or -1Includes can be foundNaNIndexOf cannot be queriedNaN
Copy the code

  • find findIndex

    // find Returns the matched item in the array of values if it cannot be found
var arr = [1.2.3.4.5]
var item = arr.find(function(item){ / / 5
    return item > 4}) returns if it cannot be foundundefined
// find returns -1 if the matched item in the array cannot be found
var item = arr.findIndex(function(item){ / / 4
    return item > 5
})
Copy the code

  • Array.of Array.form Array fill

    • Array is the same as new Array. If the argument has only one bit and is of numeric type, how many bits of the Array will be created. The value of the Array is empty
    • Unlike array. of, which creates an Array based on an argument, array. of creates an Array based on a single argument and only one digit
    • Array.from generates an Array from an iterable
    • The array fill method fill
      • The second argument is the start position of the fill, and the third argument is the end position of the fill
    // array. of creates a new Array
Array.of(5) = > [5]
// array. from transforms a pseudo-array into a true Array
var str = 'dsadada'
var arr = Array.from(str) => ["d"."s"."a"."d"."a"."d"."a"]
// Array creates a new Array
var arr = Array(5) => [empty*5]
// Fill fills the array
var arr = Array(5).fill(0) = > [0.0.0.0.0]
Copy the code

  • Object.keys Object.values Object.entries Array.prototype.keys Array.prototype.values Array.prototype.entries

    • Arr.keys () returns an iterator whose value is key
    • Arr.values () returns the iterator object value value
    • Arr.entries () returns the iterator object value as the key value
    Keys returns an array of key values in the Object
var obj = {x: 1.a: 2.b: 3.d: 4}
var keys = Object.keys(obj) // ['x','a','b','d']
// object. values Returns an array of values from the value Object
var obj = {x: 1.a: 2.b: 3.d: 4}
var keys = Object.values(obj) // [1, 2, 3, 4]
// object. entries Are an array of [key,value] entries in the return value Object
var obj = {x: 1.a: 2.b: 3.d: 4}
var keys = Object.entries(obj) //) ["x", 1] ["a", 2] ["b", 3] ["d", 4]
Copy the code

  • forEach map filter some every

    • They all take the same arguments the first argument is a callback, the second argument is this points to, and the callback takes three arguments the first argument is this item the second argument is an index and the third argument is an array
    • Do not traverse the sparse array
    // forEach map filter some every The first argument is the argument to callBack item index array convenience array the second argument is the reference to this You don't iterate over a sparse array when you encounter one
// forEach is pure traversal and returns no value even if return returns no value
var arr = [1.2.3.4]
var obj = {}
arr.forEach(function(item,index,array){
    this['value'+index] = item
   	console.log(item,index,array)
},obj)
// The map function maps the original array to produce a new array that returns a value
var arr = [1.2.3.4]
var newArr = arr.map(function(item){
    return item * 99
})
console.log(newArr)
// filter the filter function filters the items that match its criteria into an array
var arr = [1.2.3.4]
var newArr = arr.filter(item= >{
    return item > 3
})
console.log(newArr)
// some is true if an item in the array matches the condition
var arr = [1.2.3.4]
var flag = arr.some(item= >{
    return item > 3
})
console.log(flag)
// Each item in the every array is true if it matches the condition
var arr = [1.2.3.4]
var flag = arr.every(item= >{
    return item > 3
})
console.log(flag)
Copy the code

  • reduce reduceRight

    • Their arguments are: the first argument is the callback function, the second argument is the sum of the first value, and the third argument is this to point to
    • ReduceRight, reverse reduce,
    var arr = [1.2.3.4.5.6]
var res = arr.reduce(function(prev,item,index,array){
    return prev + item
},0)
Copy the code

  • flat flatMap

    • Flat will flatten the array if the parameter is not passed it will flatten one layer, if you want to flatten depth passed Infinity
    • FlatMap is flat plus a map, that is, map mapping is performed according to each parameter after flat is flattened, but its flat depth is 1
      • The detailed map usage is the same as array.prototype.map
    // How to use it
var arr1 = [1.2[3.4]];
arr1.flat();
// [1, 2, 3, 4]
// Use Infinity to expand nested arrays of any depth
var arr = [1.2[3.4[5.6[7.8[9.10]]]]];
arr.flat(Infinity);
// [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
// flatMap usage method
arr1.flatMap(x= > [x * 2]);
// [2, 4, 6, 8]
arr1.flatMap(x= > [[x * 2]]);
[[2], [4], [6], [8]]
Copy the code

  • copyWithin

    • Shallowly copies part of an array to another location in the array. This method does not change the array length
    • The method takes three parameters
      • The first parameter is the target to which target is copied. This. Length +target is used if the value is negative
      • The second argument is the start position of the copied element, which defaults to 0
      • The third argument is end, the target location of the copy element, which defaults to this.length
    • The parameter must be an integer
    // How to use it
[1.2.3.4.5].copyWithin(-2)
// [1, 2, 3, 1, 2]

[1.2.3.4.5].copyWithin(0.3)
// [4, 5, 3, 4, 5]

[1.2.3.4.5].copyWithin(0.3.4)
// [4, 2, 3, 4, 5]

[1.2.3.4.5].copyWithin(-2, -3, -1)
// [1, 2, 3, 3, 4]
Copy the code

  • Array.isArray

    • Checks whether the argument passed is an array
    • This method is superior to Instanceof because it can detect iframes
    // Array.prototype is true
Array.isArray(Array.prototype); // false
/ / when we read the MDN found that he is using a Object. The prototy. ToString. Call to determine the array
Copy the code

See the next chapter for a preview of how each method is implemented