Effective use of Array.prototype Methods.

Array methods are some of the most usefull concepts to master but also quite tricky in what each returns, what it takes as parameters and exactly what does it do to the array.

First defining a prototype. A prototype is a global constructor available f…


This content originally appeared on DEV Community and was authored by mosemet

Array methods are some of the most usefull concepts to master but also quite tricky in what each returns, what it takes as parameters and exactly what does it do to the array.

First defining a prototype. A prototype is a global constructor available for all JavaScript objects and allows the user to add new properties and methods to the array. We can create a new method that provides the sum for an array as follows:

Array.prototype.myArraySum = function () {
     let sum = 0
     for (let i = 0; i < this.length; i++){
         sum += this[i]
        }
         return sum
    }
const array = [1,2,3,5]
console.log(array.myArraySum()) //11

From the example above, we can deduce what a prototype is. It models something, and tells it how to look or behave. A method, is therefore simply a function that is defined on an object. In the example above, the object would be array and the method is myArraySum. It should be noted that myArraySum doesn't take any argument. However most inbuilt JavaScript Array methods take callbacks and other parameters.

A callback function is a function that is applied in another function as an argument, which is then invoked inside the outer function. Let us try to use a callback inside a prototype method:

Array.prototype.someMethod = function (callback) 
    {
       //Do something
       //Return the result
    }
const array = [1,2,3,4]
console.log(array.someMethod(function (a) => { 
  return a*2))

From the example of myArrySum above, we can apply a callback to understand a better on the inner mechanism of prototype methods.

Array.prototype.myArraySum =  function (callback) {
  let bound = callback.bind(this);
    bound();
     let sum = 0
     for (let i = 0; i < this.length; i++){
         sum += this[i]
        }

         return bound(sum)
    }
const array = [1,2,3,5]
console.log(array.myAarraySum((a) => a**2 - 2*a + 7)) //106

Applying a callback to myArraySum gives it more power. The callback does not change what the function does, which is giving a sum of an array, but it can definitely give us flexibility to do something to the sum without extra lines of code. In this case, we have applied a polynomial to indicate the power of callbacks. myArraySum will always return a number, NOT another array. We need to understand what the method returns. That, in my book, is most important when choosing what method to use.

JavaScript has inbuilt Array.prototype methods, which can be accessed on this link.

A deeper dive of these array methods will be explored in these series.


This content originally appeared on DEV Community and was authored by mosemet


Print Share Comment Cite Upload Translate Updates
APA

mosemet | Sciencx (2021-09-07T16:06:33+00:00) Effective use of Array.prototype Methods.. Retrieved from https://www.scien.cx/2021/09/07/effective-use-of-array-prototype-methods/

MLA
" » Effective use of Array.prototype Methods.." mosemet | Sciencx - Tuesday September 7, 2021, https://www.scien.cx/2021/09/07/effective-use-of-array-prototype-methods/
HARVARD
mosemet | Sciencx Tuesday September 7, 2021 » Effective use of Array.prototype Methods.., viewed ,<https://www.scien.cx/2021/09/07/effective-use-of-array-prototype-methods/>
VANCOUVER
mosemet | Sciencx - » Effective use of Array.prototype Methods.. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2021/09/07/effective-use-of-array-prototype-methods/
CHICAGO
" » Effective use of Array.prototype Methods.." mosemet | Sciencx - Accessed . https://www.scien.cx/2021/09/07/effective-use-of-array-prototype-methods/
IEEE
" » Effective use of Array.prototype Methods.." mosemet | Sciencx [Online]. Available: https://www.scien.cx/2021/09/07/effective-use-of-array-prototype-methods/. [Accessed: ]
rf:citation
» Effective use of Array.prototype Methods. | mosemet | Sciencx | https://www.scien.cx/2021/09/07/effective-use-of-array-prototype-methods/ |

Please log in to upload a file.




There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.