Get the last item in an array

Question

Here is my JavaScript code so far   var linkElement   document getElementById  BackButton    var loc array   document location href split       var newT   document createTextNode unescape capWords loc array loc array length-2       linkElement appendChild newT     Currently it takes the second to last item in the array from the URL  However  I want to do a check for the last item in the array to be  index html  and if so  grab the third to last item instead

User · Answer

Will this work   if  loc array pop       index html    var newT   document createTextNode unescape capWords loc array loc array length-3        else  var newT   document createTextNode unescape capWords loc array loc array length-2

User · Answer

Performance Today 2020 05 16 I perform tests of chosen solutions on Chrome v81 0  Safari v13 1 and Firefox v76 0 on MacOs High Sierra v10 13 6 Conclusions  arr arr length-1   D  is recommended as fastest cross-browser solution mutable solution arr pop    A  and immutable   last arr   L  are fast solutions I  J are slow for long strings solutions H  K  jQuery  are slowest on all browsers   Details I test two cases for solutions   mutable  A  B  C   immutable  D  E  F  G  H  I  J  my    immutable from external libraries  K  L  M    for two cases  short string - 10 characters - you can run test HERE long string - 1M characters - you can run test HERE   x000D   x000D  function A arr      return arr pop       function B arr        return arr splice -1 1      function C arr        return arr reverse   0     function D arr      return arr arr length - 1      function E arr      return arr slice -1  0       function F arr      let  last    arr slice -1     return last     function G arr      return arr slice -1  pop       function H arr      return     arr  pop       function I arr        return arr reduceRight a   gt  a      function J arr        return arr find  e i a   gt  a length  i 1      function K arr        return   arr  get -1      function L arr        return   last arr      function M arr        return   nth arr  -1              ----------    TEST    ----------  let loc array   domain   a   b   c   d   e   f   g   h   file     log    f   gt  console log    f name     f     loc array         A B C D E F G H I J K L M  forEach f  gt  log f    x000D   lt script src  https   cdnjs cloudflare com ajax libs jquery 3 3 1 jquery min js  gt  lt  script gt   lt script src  https   cdnjs cloudflare com ajax libs lodash js 4 17 15 lodash min js  integrity  sha256-VeNaFBVDhoX3H gJ37DpT nTuZTdjYro9yBruHjVmoQ   crossorigin  anonymous  gt  lt  script gt  x000D   x000D   x000D   Example results for Chrome for short string

User · Answer

Just putting another option here   loc array splice -1  0       index html    I found the above approach more clean and short onliner  Please  free feel to try this one   Note  It will modify the original array  if you don t want to modify it you can use slice    loc array slice -1  0       index html    Thanks  VinayPai for pointing this out

User · Answer

For those not afraid to overload the Array prototype  and with enumeration masking you shouldn t be    Object defineProperty  Array prototype   getLast         enumerable  false      configurable  false      writable  false      value  function             return this  this length - 1

User · Answer

const  lastItem    array slice -1    Array prototype slice with -1 can be used to create a new Array containing only the last item of the original Array  you can then use Destructuring Assignment to create a variable using the first item of that new Array    x000D   x000D  const lotteryNumbers    12  16  4  33  41  22   x000D  const  lastNumber    lotteryNumbers slice -1   x000D   x000D  console log lotteryNumbers slice -1    x000D       gt   22  x000D  console log lastNumber   x000D       gt  22 x000D   x000D   x000D

User · Answer

Another ES6 only option would be to use Array find item  index   gt         as follows   const arr    1  2  3   const last   arr find  item  index    gt  index     arr length - 1     little practical value  posted to show that index is also available for your filtering logic

User · Answer

This method will not mess with your prototype   It also guards against 0 length arrays  along with null undefined arrays   You can even override the default value if the returned default value might match an item in your array    x000D   x000D  const items    1 2 3  x000D  const noItems      x000D   x000D      x000D     Returns the last item in an array  x000D     If the array is null  undefined  or empty  the default value is returned  x000D      x000D  function arrayLast  arrayOrNull  defVal   undefined    x000D    if   arrayOrNull    arrayOrNull length     0    x000D      return defVal x000D      x000D    return arrayOrNull arrayOrNull length - 1  x000D    x000D   x000D  console log arrayLast items   x000D  console log arrayLast noItems   x000D  console log arrayLast null   x000D   x000D  console log arrayLast items   someDefault    x000D  console log arrayLast noItems   someDefault    x000D  console log arrayLast null   someDefault    x000D   x000D   x000D

User · Answer

Getting the last item of an array can be achieved by using the slice method with negative values   You can read more about it here at the bottom   var fileName   loc array slice -1  0   if fileName toLowerCase       index html         your code        Using pop   will change your array  which is not always a good idea

User · Answer

if  loc array loc array length - 1       index html           do something   else         something else     In the event that your server serves the same file for  index html  and  inDEX htML  you can also use   toLowerCase     Though  you might want to consider doing this server-side if possible  it will be cleaner and work for people without JS

User · Answer

simple answer const array    1 2 3  array array length - 1

User · Answer

I generally use underscorejs  with it you can just do   if    last loc array       index html      etc        For me that is more semantic than loc array slice -1  0

User · Answer

Two options are   var last   arr arr length - 1    or  var last   arr slice -1  0    The former is faster  but the latter looks nicer  http   jsperf com slice-vs-length-1-arr

User · Answer

Using ES6 ES2015 spread operator       you can do the following way    x000D   x000D  const data    1  2  3  4  x000D  const  last        data  reverse   x000D  console log last  x000D   x000D   x000D    Please notice that using spread operator and reverse we did not mutated original array  this is a pure way of getting a last element of the array

User · Answer

A shorter version of what  chaiguy posted   Array prototype last   function         return this this length - 1       Reading the -1 index returns undefined already   EDIT   These days the preference seems to be using modules and to avoid touching the prototype or using a global namespace   export function last array        return array array length - 1

User · Answer

I ll suggest to create helper function and reuse it every time  you ll need it  Lets make function more general to be able to get not only last item  but also second from the last and so on   function last arr  i        var i   i    0      return arr arr length -  1   i        Usage is simple  var arr    1 2 3 4 5   last arr        5 last arr  1     4 last arr  9     undefined   Now  lets solve the original issue     Grab second to last item form array  If the last item in the loc array is  index html  grab the third to last item instead    Next line does the job  last loc array  last loc array       index html    2   1     So  you ll need to rewrite  var newT   document createTextNode unescape capWords loc array loc array length-2         in this way  var newT   document createTextNode unescape capWords last loc array  last loc array       index html    2   1         or use additional variable to increase readability  var nodeName   last loc array  last loc array       index html    2   1   var newT   document createTextNode unescape capWords nodeName

User · Answer

Whatever you do don t just use reverse       A few answers mention reverse but don t mention the fact that reverse modifies the original array  and doesn t  as in some other language or frameworks  return a copy  var animals     dog    cat     animals reverse   0   quot cat quot   animals reverse   0   quot dog quot   animals reverse   1   quot dog quot   animals reverse   1   quot cat quot   This can be the worst type of code to debug

User · Answer

ES6 object destructuring is another way to go    x000D   x000D  const  length   length-1   last   1 2 3 4 5  x000D  console log last  x000D   x000D   x000D    You extract length property from Array using object destructuring  You create another dynamic key using already extracted key by  length-1  and assign it to last  all in one line

User · Answer

Here s more Javascript art if you came here looking for it  In the spirit of another answer that used reduceRight    but shorter    3  2  1  5  reduceRight a   gt  a     It relies on the fact that  in case you don t provide an initial value  the very last element is selected as the initial one  check the docs here   Since the callback just keeps returning the initial value  the last element will be the one being returned in the end   Beware that this should be considered Javascript art and is by no means the way I would recommend doing it  mostly because it runs in O n  time  but also because it hurts readability   And now for the serious answer  The best way I see  considering you want it more concise than array array length - 1   is this   const last   a   gt  a a length - 1     Then just use the function   last  3  2  1  5     The function is actually useful in case you re dealing with an anonymous array like  3  2  1  5  used above  otherwise you d have to instantiate it twice  which would be inefficient and ugly    3  2  1  5   3  2  1  5  length - 1    Ugh   For instance  here s a situation where you have an anonymous array and you d have to define a variable  but you can use last   instead   last  1 2 3  split

User · Answer

In ECMAScript proposal Stage 1 there is a suggestion to add an array property that will return the last element  proposal-array-last   Syntax    arr lastItem    get last item arr lastItem    value     set last item  arr lastIndex    get last index   You can use polyfill   Proposal author  Keith Cirkel chai autor

User · Answer

This can be done with lodash   last or   nth    x000D   x000D  var data    1  2  3  4  x000D  var last     nth data  -1  x000D  console log last  x000D   lt script src  https   cdnjs cloudflare com ajax libs lodash js 4 17 11 lodash js  gt  lt  script gt  x000D   x000D   x000D

User · Answer

Normally you are not supposed to mess with the prototype of built-in types but here is a hack shortcut  Object defineProperty Array prototype   last       get         return this this length - 1             This will allow all array objects to have a last property  which you can use like so  const letters     a    b    c    d    e    console log letters last       e   You are not supposed to mess with a built-in type s prototype because you never when a new ES version will be released and in the event that a new version uses the same property name as your custom property  all sorts of breaks can happen  You COULD make the property to something that you know an ES version would  like lastItem but that is at the discretion of the developer

User · Answer

EDITED    Recently I came up with one more solution which I now think is the best for my needs   function w anArray      return       last           return anArray  anArray length - 1                   With the above definition in effect I can now say   let last   w   1 2 3   last    console log last       - gt  3   The name  w  stands for  wrapper    You can see how you could easily add more  methods besides  last    to this wrapper   I say  best for my needs   because this allows me to easily add other such  helper methods  to any JavaScript built-in type  What comes  to mind are the car   and cdr   of Lisp for  instance

User · Answer

This is clean and efficient    let list      a    b    c      xs   gt  xs xs length - 1   list    If you install a pipe operator using Babel it becomes    list   gt   xs   gt  xs xs length - 1

User · Answer

Use Array pop   var lastItem   anArray pop      Important   This returns the last element and removes it from the array

User · Answer

Update 2020 Array prototype last   function        return this this length - 1      let a    1  2  3   4  5     console log a last          4  5   console log a last   last        5   Setter and Getter Array prototype last   function val null      if  this length     0        if  val  this 0    val      else return null            temp   this    while typeof temp temp length-1       quot object quot         temp   temp temp length-1            if  val  temp temp length-1    val    Setter     else return temp temp length-1     Getter       var arr     1  2    2  3      a    b      c    d      console log arr last         d       arr last  quot dd quot     console log arr          1  2      2  3         a    b        c    dd

User · Answer

You can achieve this issue also without extracting an array from the url  This is my alternative  var hasIndex    document location href search  index html       -1    doSomething     doSomethingElse       Greetings

User · Answer

Here s how to get it with no effect on the original ARRAY  a    1 2 5 6 1 874 98  abc    a length    returns 8 elements   If you use pop    it will modify your array  a pop        will return  abc  AND REMOVES IT from the array  a length     returns 7   But you can use this so it has no effect on the original array   a slice -1  pop       will return  abc  won t do modify the array                        because slice creates a new array object  a length              returns 8  no modification and you ve got you last element

User · Answer

There is also a npm module  that add last to Array prototype  npm install array-prototype-last --save   usage  require  array-prototype-last      1  2  3  last      gt  3      last      gt  undefined

User · Answer

Personally I would upvote answer by kuporific   kritzikratzi  The array array length-1  method gets very ugly if you re working with nested arrays   var array     1 2 3    4 5 6    7 8 9     array slice -1  0      instead of    array array length-1      Much easier to read with nested arrays   array slice -1  0  slice -1  0      instead of   array array length-1  array array length-1  length-1

User · Answer

const lastElement   myArray myArray length - 1    This is the best options from performance point of view   1000 times faster than arr slice -1

User · Answer

This question has been around a long time  so I m surprised that no one mentioned just putting the last element back on after a pop     arr pop   is exactly as efficient as arr arr length-1   and both are the same speed as arr push     Therefore  you can get away with   ---EDITED  check that thePop isn t undefined before pushing ---  let thePop   arr pop   thePop  amp  amp  arr push thePop    ---END EDIT---  Which can be reduced to this  same speed  EDIT  but unsafe      arr push thePop   arr pop         Unsafe if arr empty   This is twice as slow as arr arr length-1   but you don t have to stuff around with an index  That s worth gold on any day    Of the solutions I ve tried  and in multiples of the Execution Time Unit  ETU  of arr arr length-1     Method                ETUs 5 elems     ETU 1 million elems   arr arr length - 1       ------ gt  1              ----- gt  1  let myPop   arr pop   arr push myPop           ------ gt  2              ----- gt  2  arr slice -1  pop        ------ gt  36             ----- gt  924    arr slice -1  0          ------ gt  36             ----- gt  924        arr  pop             ------ gt  120            ----- gt   21 000 000      The last three options  ESPECIALLY     arr  pop    get VERY much worse as the size of the array increases  On a machine without the memory limitations of my machine      arr  pop   probably maintains something like it s 120 1 ratio  Still  no one likes a resource hog

User · Answer

You can use this pattern     let  last    arr slice -1     While it reads rather nicely  keep in mind it creates a new array so it s less efficient than other solutions but it ll almost never be the performance bottleneck of your application

User · Answer

You could add a new property getter to the prototype of Array so that it is accessible through all instances of Array   Getters allow you to access the return value of a function just as if it were the value of a property  The return value of the function of course is the last value of the array  this this length - 1     Finally you wrap it in a condition that checks whether the last-property is still undefined  not defined by another script that might rely on it    if typeof Array prototype last      undefined         Object defineProperty Array prototype   last             get   function                 return this this length - 1                           Now you can access it like  1  2  3  last                  gt  3    or var test    50  1000   alert test last               Says  1000    Does not work in IE   8

User · Answer

If one wants to get the last element in one go  he she may use Array splice     lastElement   document location href split      splice -1 1     Here  there is no need to store the split elements in an array  and then get to the last element  If getting last element is the only objective  this should be used   Note  This changes the original array by removing its last element  Think of splice -1 1  as a pop   function that pops the last element

User · Answer

to access the last element in array using c  we can use GetUpperBound 0     0  in case if this one dimention array  my array my array GetUpperBound 0     this is the last element in this one dim array

User · Answer

How about something like below   if   index html      array array length - 1            do this    else         do that      If using Underscore or Lodash  you can use   last    so something like   if   index html        last array            do this    else         do that      Or you can create your own last function   const  last   arr   gt  arr arr length - 1     and use it like   if   index html       last array            do this    else         do that

User · Answer

Multiple ways to find last value of an array in javascript  Without affecting original array   x000D   x000D  var arr    1 2 3 4 5    console log arr slice -1  0   console log arr arr length-1   const  last        arr  reverse    console log last   let copyArr       arr   console log copyArr reverse   0    x000D   x000D   x000D    Modifies original array   x000D   x000D  var arr    1 2 3 4 5    console log arr pop    arr push 5  console log    arr splice -1    x000D   x000D   x000D    By creating own helper method   x000D   x000D  let arr    1  2  3  4  5    Object defineProperty arr   last      get  function      return this this length-1          console log arr last   x000D   x000D   x000D

User · Answer

Not implemented yet  The new TC39 Array prototype lastItem proposal  stage 1  adds a getter that returns the last item in an array  const myArray    1  2  3   console log myArray lastItem      gt  3  The Array prototype at proposal  stage 3  adds a different API  MDN   const myArray    1  2  3   console log myArray at -1       gt  3

User · Answer

I think this should work fine   var arr    1  2  3   last element   arr reverse   0     Just reverse the array and get the first element

User · Answer

Using reduceRight    3 2 1 5  reduceRight  a v    gt  a   a   v

User · Answer

Functional programming with Ramda  If you re using JS  I would suggest checking out Ramda which is a functional-programming library  like Lodash and Underscore  except more advanced and modular   Ramda provides this with R last  import   as R from  ramda   R last   fi    fo    fum         gt   fum  R last          gt  undefined  R last  abc        gt   c  R last          gt       It further provides init  head  tail  List monster from  Learn You a Haskell

User · Answer

You can add a last   function to the Array prototype   Array prototype last   function          return this this length - 1

User · Answer

The  cleanest  ES6 way  IMO  would be   const foo    1 2 3 4   const bar       foo  pop      This avoids mutating foo  as  pop   would had  if we didn t used the spread operator  That said  I like aswell the foo slice -1  0  solution

User · Answer

Not sure if there s a drawback  but this seems quite concise    arr slice -1  0     or  arr slice -1  pop     Both will return undefined if the array is empty

User · Answer

The simple way to get last item of array   var last item   loc array reverse   0     Of course  we need to check to make sure array has at least one item first

User · Answer

array reverse   0    That s so simple

User · Answer

I think the easiest and super inefficient way is   var array     fenerbahce   arsenal   milan    var reversed array   array reverse      inverts array  milan arsenal fenerbahce  console log reversed array 0      result is  milan

User · Answer

I d rather use array pop   than indexes   while loc array pop      index html      var newT   document createTextNode unescape capWords loc array loc array length        this way you always get the element previous to index html  providing your array has isolated index html as one item   Note  You ll lose the last elements from the array  though

User · Answer

jQuery solves this neatly    gt     1 2 3   get -1  3  gt        get -1  undefined

User · Answer

Using lodash   last array  Gets the last element of array    x000D   x000D  data    1 2 3  x000D  last     last data  x000D  console log last  x000D   lt script src  https   cdnjs cloudflare com ajax libs lodash js 4 17 4 lodash min js  gt  lt  script gt  x000D   x000D   x000D

User · Answer

The arrow function makes the fastest-performing method more concise  by not repeating the name of the array   var lastItem    a   gt  a a length - 1   loc array

User · Answer

For a readable and concise solution  you can use a combination of Array prototype slice and destructuring   const linkElement   document getElementById  BackButton    const loc array   document location href split           assign the last three items of the array to separate variables const  thirdLast  secondLast  last    loc array slice -3       use the second last item as the slug    let parentSlug   secondLast   if  last      index html             unless this is an index   parentSlug   thirdLast     const newT   document createTextNode    unescape      capWords parentSlug          linkElement appendChild newT     But to simply get the last item in an array  I prefer this notation   const  lastItem    loc array slice -1

User · Answer

To prevent removing last item from origin array you could use  Array from myArray  pop     Mostly supported of all browsers  ES6

[javascript] Get the last item in an array

Examples related to javascript

Examples related to arrays