Summary of Common Functions of JavaScript Handwritten Array

  • 2021-09-24 21:26:11
  • OfStack

Preface to the table of contents
Parameter description
forEach function
filter function
find function
findIndex function
fill function
map function
some function
every function
reduce function
reduceRight function
Finally

Preface

In the development process, we often use some api related operations of the array, including forEach, filter, find, findIndex, map, some, every, reduce, reduceRight and other functional methods.

Today, let's try to write these functions by hand and implement these function methods by array. For convenience, extend directly on the array prototype object prototype.

This article Githab has been uploaded, and more previous articles have been sorted out.

Text

Parameter description

callbackFn callback function

this value used by thisArg when executing callbackFn

The element being processed in the currentValue array

index Current Index

array Source Array

accumulator Accumulator

initialValue reduce reduceRight Default value of the first parameter when the callbackFn function is called for the first time

this object implemented by element itself

forEach function

Syntax: arr.forEach(callbackFn(currentValue [, index [, array]])[, thisArg])

Method function: Executes the given function once on each element of the array.

Return: undefined.

Custom function: myForEach.


Array.prototype.myForEach = function(callbackFn, thisArg) {
 if (typeof callbackFn !== 'function') throw ('callbackFn Argument must be a function ');
 let element = this,
 len = element && element.length || 0;
 if (!thisArg) thisArg = element;
 for (let index = 0; index < len; index++) {
 callbackFn.call(thisArg, element[index], index, element);
 }
};

filter function

Syntax: var newArray = arr.filter(callbackFn(currentValue[, index[, array]])[, thisArg])

Method functionality: Creates a new array that contains all the elements of the test implemented through the provided function.

Returns: 1 new array of elements that pass the test, or an empty array if none of the array elements pass the test.

Custom function: myFilter.


Array.prototype.myFilter = function(callbackFn, thisArg) {
 if (typeof callbackFn !== 'function') throw ('callbackFn Argument must be a function ');
 let element = this,
 len = element && element.length || 0,
 result = [];
 if (!thisArg) thisArg = element;
 for (let index = 0; index < len; index++) {
 if (callbackFn.call(thisArg, element[index], index, element)) result.push(element[index]);
 }
 return result;
};

find function

Syntax: arr.find(callbackFn[, thisArg])

Method function: Returns the value of the first element in the array that satisfies the provided test function. Otherwise undefined is returned.

Return: The value of the first element in the array that satisfies the supplied test function, otherwise undefined is returned.

Custom function: myFind.


Array.prototype.myFind = function(callbackFn, thisArg) {
 if (typeof callbackFn !== 'function') throw ('callbackFn Argument must be a function ');
 let element = this,
 len = element && element.length || 0;
 if (!thisArg) thisArg = element;
 for (let index = 0; index < len; index++) {
 if (callbackFn.call(thisArg, element[index], index, element)) {
  return element[index];
 }
 }
 return
}

findIndex function

Syntax: arr.findIndex(callbackFn[, thisArg])

Method function: Returns the value of the first element in the array that satisfies the provided test function. Otherwise undefined is returned.

Returns: The index of the first element of the array by providing the test function. Otherwise, return-1.

Custom function: myFindIndex.


Array.prototype.myFindIndex = function(callbackFn, thisArg) {
 if (typeof callbackFn !== 'function') throw ('callbackFn Argument must be a function ');
 let element = this,
 len = element && element.length || 0;
 if (!thisArg) thisArg = element;
 for (let index = 0; index < len; index++) {
 if (callbackFn.call(thisArg, element[index], index, element)) return index;
 }
 return -1;
}

fill function

Syntax: arr.fill(value[, start[, end]])

Method function: Fill all elements in an array from the start index to the end index with a fixed value. Termination index is not included.

Return: Returns the replaced value, and the original array changes.

Custom function: myFill.


Array.prototype.myFill = function(value, start = 0, end) {
 let element = this,
 len = element && element.length || 0;
 end = end || len;
 let loopStart = start < 0 ? 0 : start, //  Set the start value of the loop 
 loopEnd = end >= len ? len : end; //  Set the end value of the loop 

 for (; loopStart < loopEnd; loopStart++) {
 element[loopStart] = value;
 }
 return element;
}

map function

Syntax: var new_array = arr.map(function callbackFn(currentValue[, index[, array]]) {// Return element for new_array }[, thisArg])

Method functionality: Creates a new array with the result that each element in the array is the return value after calling the supplied function once.

Returns: Tests whether at least 1 element in the array has passed the function test provided. It returns a value of type Boolean. A new array consisting of the results of callback functions performed by each element of the original array.

Custom function: myMap.


Array.prototype.myMap = function(callbackFn, thisArg) {
 if (typeof callbackFn !== 'function') throw ('callbackFn Argument must be a function ');
 let element = this,
 len = element && element.length || 0,
 result = [];
 if (!thisArg) thisArg = element;
 for (let index = 0; index < len; index++) {
 result[index] = callbackFn.call(thisArg, element[index], index, element);
 }
 return result;
}

some function

Syntax: arr.some(callbackFn(currentValue[, index[, array]])[, thisArg])

Method functionality: Tests whether at least 1 element in the array passes the function test provided. It returns a value of type Boolean.

Return: At least 1 element in the array will return true if it passes the test of callback function; Only when all elements fail the test of callback function will the return value be false.

Custom function: mySome.


Array.prototype.mySome = function(callbackFn, thisArg) {
 if (typeof callbackFn !== 'function') throw ('callbackFn Argument must be a function ');
 let element = this,
 len = element && element.length || 0;
 if (!thisArg) thisArg = element;
 for (let index = 0; index < len; index++) {
 if (callbackFn.call(thisArg, element[index], index, element)) return true;
 }
 return false;
}

every function

Syntax: arr.every(callbackFn(currentValue[, index[, array]])[, thisArg])

Method function: Test whether all elements in an array can pass the test of a specified function. It returns 1 Boolean value.

Return: true is returned if every return of the callback function is an true value, otherwise false is returned.

Custom function: myEvery.


Array.prototype.myEvery = function(callbackFn, thisArg) {
 if (typeof callbackFn !== 'function') throw ('callbackFn Argument must be a function ');
 let element = this,
  len = element && element.length || 0;
 if (!thisArg) thisArg = element;
 for(let index = 0; index < len; index++) {
  if (!callbackFn.call(thisArg, element[index], index, element)) return false;
 }
 return true;
}

reduce function

Syntax: arr.reduce(callback(accumulator, currentValue[, index[, array]])[, initialValue])

Method functionality: Execute one reducer function provided by you (in ascending order) on each element in the array, summarizing its results into a single return value.

Return: The result of the cumulative processing of the function.

Custom function: myReduce.


Array.prototype.myReduce = function(callbackFn, initialValue) {
 if (typeof callbackFn !== 'function') throw ('callbackFn Argument must be a function ');
 let element = this,
  len = element.length || 0,
  index = 0,
  result;
 if (arguments.length >= 2) {
  result = arguments[1];
 } else {
  while (index < len && !(index in element)) index++;
  if (index >= len) throw new TypeError('Reduce of empty array ' + 'with no initial value');
  result = element[index++];
 }

 while (index < len) {
  if (index in element) result = callbackFn(result, element[index], index, element);
  index++;
 }
 return result;
}

reduceRight function

Syntax: arr.reduceRight(callback(accumulator, currentValue[, index[, array]])[, initialValue])

Method functionality: Accept 1 function as an accumulator (accumulator) and reduce each value of the array (right to left) to a single value.

Return: The return value after execution.

Custom function: myReduceRight.


Array.prototype.myReduceRight = function(callbackFn, initialValue) {
 if (typeof callbackFn !== 'function') throw ('callbackFn Argument must be a function ');
 let element = this,
  len = element.length || 0,
  index = len - 1,
  result;
 if (arguments.length >= 2) {
  result = arguments[1];
 } else {
  while (index >= 0 && !(index in element)) {
   index--;
  }
  if (index < 0) {
   throw new TypeError('reduceRight of empty array with no initial value');
  }
  result = element[index--];
 }
 for (; index >= 0; index--) {
  if (index in element) {
   result = callbackFn(result, element[index], index, element);
  }
 }
 return result;
}

Finally


Related articles: