Home > Article > Web Front-end > 9 ways to summarize JavaScript array instances
This article brings you relevant knowledge about javascript. It mainly introduces 9 methods of JavaScript array instances. The detailed introduction of the article around the topic does not have certain reference value. It is needed Friends can refer to it.
[Related recommendations: javascript video tutorial, web front-end】
Handwritten JS native API is very common in interviews. Today, while working hard (while fishing), I turned to the part about array instance methods in the MDN article. I happened to be bored, so I wrote a few instance methods by hand to review the basic content. And record it.
If you still don’t know the difference between iteration methods in array instances, you can look at the picture below:
This method will return a new array. Each item in the array is the result of executing the callback function provided by map
.
The implementation code is as follows:
const map = (array, fun) => { // 类型约束 if (Object.prototype.toString.call(array) !== '[object Array]') throw new TypeError(array + ' is not a array') if (typeof fun !== 'function') throw new TypeError(fun + ' is not a function') // 定义一个空数组,用于存放修改后的数据 let res = [] for (let i = 0; i < array.length; i++) { res.push(fun(array[i])) } return res } // 测试 let res = map([1, 2, 3], item => { return item * 2 }) console.log(res) // [ 2, 4, 6 ]
This method will return a new array, and the values in the array satisfy filter
The value of the callback function provided,
The implementation code is as follows:
const filter = (array, fun) => { // 类型约束 if (Object.prototype.toString.call(array) !== '[object Array]') throw new TypeError(array + ' is not a array') if (typeof fun !== 'function') throw new TypeError(fun + ' is not a function') // 定义一个空数组,用于存放符合条件的数组项 let res = [] for (let i = 0; i < array.length; i++) { // 将数组中的每一项都调用传入的函数,如果返回结果为true,则将结果push进数组,最后返回 fun(array[i]) && res.push(array[i]) } return res } // 测试 let res = filter([1, 2, 3], item => { return item > 2 }) console.log(res) // [ 3 ]
This method will judge each item in the array, If one of the items satisfies the condition in the callback function, true
is returned. If none is satisfied, false
is returned.
The implementation code is as follows:
const some = (array, fun) => { // 类型约束 if (Object.prototype.toString.call(array) !== '[object Array]') throw new TypeError(array + ' is not a array') if (typeof fun !== 'function') throw new TypeError(fun + ' is not a function') let flag = false for (let i of array) { if (fun(i)) { flag = true break } } return flag } let res = some([1, 2, 3], item => { return item > 2 }) console.log(res) // true
This method will judge each item in the array. If all items meet the conditions in the callback function, Returns true
otherwise returns false
.
The implementation code is as follows:
const every = (array, fun) => { // 类型约束 if (Object.prototype.toString.call(array) !== '[object Array]') throw new TypeError(array + ' is not a array') if (typeof fun !== 'function') throw new TypeError(fun + ' is not a function') let flag = true for (let i of array) { if (!fun(i)) { flag = false break } } return flag } let res = every([1, 2, 3], item => { return item > 0 }) console.log(res) // true
This method will cause each element in the array to execute the callback function we provide, And summarize the results and return them, the implementation code is as follows:
const reduce = (array, fun, initialValue) => { // 类型约束 if (Object.prototype.toString.call(array) !== '[object Array]') throw new TypeError(array + ' is not a array') if (typeof fun !== 'function') throw new TypeError(fun + ' is not a function') let accumulator = initialValue for (let i = 0; i < array.length; i++) { accumulator = fun(accumulator, array[i], i, array) } return accumulator } const arr = [1, 2, 3] console.log(arr.reduce(v => v + 10, 10)) // 40 console.log(reduce(arr, v => v + 10, 10)) // 40
This method is relatively simple, it is to traverse the array method, each item in the array is executed The callback function, the implementation code is as follows:
const forEach = (array, fun) => { // 类型约束 if (Object.prototype.toString.call(array) !== '[object Array]') throw new TypeError(array + ' is not a array') if (typeof fun !== 'function') throw new TypeError(fun + ' is not a function') for (let i of array) { fun(i) } } let res = forEach([1, 2, 3], item => { console.log(item) })
These two methods are relatively similar, one returns the element and the other returns the index of the element. Here we write one , the implementation code is as follows:
const myFind = (array, fun) => { // 类型约束 if (Object.prototype.toString.call(array) !== '[object Array]') throw new TypeError(array + ' is not a array') if (typeof fun !== 'function') throw new TypeError(fun + ' is not a function') let res for (let i = 0; i < array.length; i++) { if (fun(array[i])) { res = array[i] } } return res } // 测试 let res = myFind([1, 2, 3], item => { return item > 2 }) console.log(res) // 3
This method can splice all elements in the array according to the specified string and return the spliced string,
The implementation code is as follows:
const join = (array, separator = ',') => { // 类型约束 if (Object.prototype.toString.call(array) !== '[object Array]') throw new TypeError(array + ' is not a array') if (typeof separator !== 'string') throw new TypeError(separator + ' is not a string') let res = array[0].toString() for (let i = 0; i < array.length - 1; i++) { res += separator + array[i + 1].toString() } return res } // 测试 let res = join([1, 2, 3], '-') console.log(res) // 1-2-3
[Related recommendations: javascript video tutorial, web front-end]
The above is the detailed content of 9 ways to summarize JavaScript array instances. For more information, please follow other related articles on the PHP Chinese website!