Get the first and last item in an Array - JS

Question

I am trying to get the first and last item in array and display them in an object.

What i did is that I use the first and last function and then assign the first item as the key and the last item as the value.

var myArray = ['Rodel', 'Mike', 'Ronnie', 'Betus'];

function firstAndLast(array) {

var firstItem = myArray.first;
var lastItem = myArray.last;

 var objOutput = {
   firstItem : lastItem 
  };

}

var display = transformFirstAndLast(myArray);

console.log(display);

however this one gets me into trouble. It says undefined. Any idea why is that?

Answer 1

Allow me to share an alternative approach: const all = ['food', 'clean', 'cat', 'shower', 'work out'];

console.log(`You have ${all.length} tasks in total.`);
console.log(`First task: ${all[0]}`);
console.log(`Last task: ${all[all.length - 1]}`);

This code efficiently displays the total number of tasks, along with the first and last tasks in the list.

Answer 2

Regular answer

const arr = [1, 2, 3, 4];

const first = arr.at(0);
const last = arr.at(-1);

Code golf one-liner

^{Might be somewhat more readable and easy to digest than other one-liner answers.}

const arr = [1, 2, 3, 4];

const [first, last] = [0, -1].map(i => arr.at(i));

Answer 3

Change last to first

const x=[1,2,3]
x.unshift(x.splice(x.length-1,1)[0])
console.log(x) // [ 3, 1, 2 ]

Answer 4

Please try this to find out the first and last value of an array

var array = ['Rodel', 'Mike', 'Ronnie', 'Betus'];

let {0 : a ,[array.length - 1] : b} = array;

 var objOutput = {
   first : a,
   last:b
  };

console.log(objOutput)

Answer 5

In Array :- Check first and last element in array are same or not.. 
function hasSame(arr1, arr2) {
    for(i=0; i <arr1.length ; i++) {
    for(j=0; j <arr2.length ; j++) {
        if(arr1[0] === arr2[0] && arr1[2] ===  arr2[2]) {
            return true
        } else
          return false;
    }
}
}

console.log(hasSame(
    ["white bread", "lettuce", "toast"],
    ["white bread", "tomato", "toast"]
))

Answer 6

As of 2021, you can use Array.prototype.at()

let colors = ['red',  'green', 'blue']

let first = colors.at(0) // red
let last = colors.at(-1) // blue

To read more about Array.prototype.at()

Answer 7

I prefer using a simple array filter:

const myArray = ['one', 2, 3, 4, 5];
const filterFirstLast = (e, i, a) => i === 0 || i === a.length - 1;
const [ first, last ] = myArray.filter(filterFirstLast);
console.log(first, last); // outputs: 'one', 5

// dealing with insufficient input is another topic (input array length < 2)
console.log(['one'].filter(filterFirstLast )); // outputs: ['one']
console.log([].filter(filterFirstLast )); // outputs: []

transforming to something else is as easy

const obj = { [first]: last }; // will be: { one: 5 }, but never { one: "one" }
// OR, if you allow ['one'] to apply for both, if last is nullish (e.g. undefined, null, ""):
const obj = { [first]: last || first }; // will be: { one: 5 }, can be { one: "one" }

Answer 8

Another variation of roli answer

function firstAndLast(array) {
    return { [[...array].shift()]: [...array].pop() };
}

Answer 9

ES6

var objOutput = { [myArray[0]]: [...myArray].pop() }

var myArray = ['Rodel', 'Mike', 'Ronnie', 'Betus'];

var objOutput = { [myArray[0]]: [...myArray].pop() }

console.log(objOutput);

Answer 10

With ES6 and destructuring:

const myArray = ['Rodel', 'Mike', 'Ronnie', 'Betus'];

const { 0: first, length, [length -1]: last } = myArray //getting first and last el from array
const obj = { first, last }

console.log(obj) // {  first: "Rodel",  last: "Betus" }

Answer 11

Do like this :-

var myArray = ['Rodel', 'Mike', 'Ronnie', 'Betus'];

function firstAndLast(myArr) {

    var firstItem = myArr[0];
    var lastItem = myArr[myArr.length - 1];
    var objOutput = {}; 
    objOutput[firstItem] = lastItem;
    return objOutput;
}

var display = firstAndLast(myArray);

console.log(display);

Answer 12

I've modified your code :

var myArray = ['Rodel', 'Mike', 'Ronnie', 'Betus'];

function firstAndLast(array) {

var firstItem = myArray[0];
var lastItem = myArray[myArray.length-1];

 var objOutput = {
   first : firstItem,
   last : lastItem
  };

return objOutput;
}

var display = firstAndLast(myArray);

console.log(display);

UPDATE: New Modification

var myArray = ['Rodel', 'Mike', 'Ronnie', 'Betus'];

function firstAndLast(array) {

var firstItem = myArray[0];
var lastItem = myArray[myArray.length-1];

var objOutput = {};
objOutput[firstItem]=lastItem

return objOutput;
}

var display = firstAndLast(myArray);

console.log(display);

Answer 13

To make your first and last properties work as you want, define them as properties with "getters" on the array prototype.

(You also have an inconsistency between firstAndLastArray and transformFirstAndLast, which needed to be fixed.)

Returning {firstName: lastName} will not do what you presumably want, since it will yield the key firstName. To use the actual first name as the key, use computed property names ({[firstName]: lastName}).

Object.defineProperties(Array.prototype, {
  first: { get() { return this[0]; }},
  last:  { get() { return this[this.length - 1]; }}
});

var myArray = ['Rodel', 'Mike', 'Ronnie', 'Betus'];

function firstAndLast(array) {
  var firstItem = myArray.first;
  var lastItem = myArray.last;
  
  return {[firstItem]: lastItem};
}

var display = firstAndLast(myArray);

console.log(display);

Or, much more simply, just

function firstAndLast(array) {
  return {[array[0]]: array[array.length - 1]};
}

If you don't want to, or cannot, use computed property names, then

function firstAndLast(array) {
  var result = {};
  result[array[0]] = array[array.length - 1];
  return result;
}