Have you mastered the knowledge points of ES7-ES12?

Array.prototype.includes()

The includes() method is used to determine whether an array contains a specified value. If it does, it returns true; otherwise, it returns false.

arr.includes(valueToFind[, fromIndex])

valueToFind, the element value to find.
fromIndex optional. Search valueToFind from the fromIndex index. If it is a negative value (i.e. jump the absolute value of fromIndex from the end, and then search back). The default is 0.

const arr = ['es6', 'es7', 'es8']
console.log(arr.includes('es7')) // true
console.log(arr.includes('es7', 1)) // true
console.log(arr.includes('es7', 2)) // false
console.log(arr.includes("es7", -1)); // fsle
console.log(arr.includes("es7", -2)); // true

Using includes() to find strings is case sensitive.

const arr = ["es6", "es7", "es8", "a"];
console.log(arr.includes("A")); // false
  • List item

Using includes() can only judge the data of simple type, but it cannot judge the data of complex type, such as array of object type and two-dimensional array

const arr = ['es6', ['es7', 'es8'], 'es9',{name:"jimmy"}]
console.log(arr.includes(["es7", "es8"])); // false
console.log(arr.includes({name:"jimmy"})); // false

Can recognize NaN, but indexOf cannot recognize NaN

const arr = ['es6', 'es7', NaN, 'es8']
console.log(arr.includes(NaN)) // true
console.log(arr.indexOf(NaN)) // -1

Finally, if you only want to know whether a value exists in the array and don't care about its index position, it is recommended to use includes(). If you want to get the position of a value in the array, use the indexOf method

Array.prototype.flat()

let newArray = arr.flat([depth])
  1. Depth optional specifies the structure depth of the nested array to be extracted. The default value is 1.
  2. The flat() method recursively traverses the array according to a specified depth, and combines all elements with the elements in the traversed sub array into a new array.
const arr1 = [0, 1, 2, [3, 4]];
console.log(arr1.flat());  //  [0, 1, 2, 3, 4]
const arr2 = [0, 1, 2, [[[3, 4]]]];
console.log(arr2.flat(2));  //  [0, 1, 2, [3, 4]]

//With Infinity, you can expand nested arrays of any depth
var arr4 = [1, 2, [3, 4, [5, 6, [7, 8, [9, 10]]]]];
arr4.flat(Infinity); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

// `The flat() ` method will remove empty items from the array:
var arr5 = [1, 2, , 4, 5];
arr5.flat(); // [1, 2, 4, 5]

Array.prototype.flatMap()

The flatMap() method first uses the mapping function to map each element, and then compresses the result into a new array. It can also be seen from the name of the method that it contains two functions, one is map and the other is flat (with a depth of 1).

var new_array = arr.flatMap(function callback(currentValue[, index[, array]]) {
    // Returns the elements of a new array
}[, thisArg])
  • callback is a function that can generate elements in a new array. Three parameters can be passed in: currentValue, the element currently being processed in the array, and index. The index of the current element currently being processed in the array can be selected. Array optional map array to be called

  • thisArg optional this value used when the callback function is executed.

const numbers = [1, 2, 3]
numbers.map(x => [x * 2]) // [[2], [4], [6]]
numbers.flatMap(x => [x * 2]) // [2, 4, 6]

This example can simply compare the difference between map and flatMap. Of course, you can also see the following example:

Insert code slice here

Object.values()

Object. The values method returns an array whose members are the key values of all the enumerable properties of the parameter object itself (excluding inheritance).

const obj = {
  name: "jimmy",
  age: 18,
  height: 188,
};
console.log(Object.values(obj)); // [ 'jimmy', 18, 188 ]

Keywords: Javascript Front-end

Added by Bendude14 on Tue, 15 Feb 2022 09:17:47 +0200