Javascript Display the first letter of every array element only once

Question

I'm tying to display the first letter of every array element only once along with the main element title. I have listed the example below where you can see the list along with it's respected first letter. I want the list to appear as it is, but don't want to get their first letter repeated. https://jsfiddle.net/z42u1d9o/

My code:

var cars = ["Brown", "Blue", "Bingo", "Vietnam", "America", "India", "Volvo", "Saab", "Ford", "Fiat", "Audi"];
var text = "";
cars = cars.sort();
return cars.map(item => {
    var firstLetter = item.split('')[0];
  text += item + '-' +firstLetter + "<br>";
  document.getElementById("demo").innerHTML = text;
})

Please could you mention, what problem are you facing? what is expected output? — amrender singh
– amrender singh, Commented Oct 29, 2019 at 7:01
It's nice, but your text does not include a problem, nor an actual question. I could now start guessing what the problem is, but why should i? Do you want each first letter to only appear once, as in, e.g. no multiple "A"? — ASDFGerte
– ASDFGerte, Commented Oct 29, 2019 at 7:01
I have asked in the very first sentence that I want to display the first letter only once, so how to avoid displaying it every time — Shoeb Mirza
– Shoeb Mirza, Commented Oct 29, 2019 at 7:26
So you want it to be ["Brown-B", "Blue", "Bingo"] for the first three items? — Rickard Elimää
– Rickard Elimää, Commented Oct 29, 2019 at 8:42

Rickard Elimää · Accepted Answer · 2019-10-29 09:06:52Z

1

I would use an object to store every added letter and to check against while looping through the array.

var cars = ["Brown", "Blue", "Bingo", "Vietnam", "America", "India", "Volvo", "Saab", "Ford", "Fiat", "Audi"],
    text = "",
    alreadyAdded = {},
    firstLetter = "";
  
  cars.sort();

  for (car of cars) {
     firstLetter = car[0];
     
     if (alreadyAdded[firstLetter]) {
        text += car;
     } else {
        alreadyAdded[firstLetter] = true;
        text += car + "-" + firstLetter;
     }

     text += " ";
  }


console.log(text);

answered Oct 29, 2019 at 9:06

Rickard Elimää

7,6763 gold badges18 silver badges36 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Nitish Narang · Accepted Answer · 2019-10-29 13:37:02Z

1

You can try following approach -

let result = ["Brown", "Blue", "Bingo", "Vietnam", "America", "India", "Volvo", "Saab", "Ford", "Fiat", "Audi"].sort().map((d, i, a) => (i == 0 || d[0] != a[i-1][0]) ? d + '-' + d[0] : d)


console.log(result)

edited Oct 29, 2019 at 13:37

answered Oct 29, 2019 at 8:33

Nitish Narang

4,2042 gold badges18 silver badges22 bronze badges

1 Comment

Nitish Narang Over a year ago

Ah! Without Output it becomes difficult what is wanted. Done the edit @ShoebMirza. Does it look good now?

Christiaan Nieuwlaat · Accepted Answer · 2019-10-29 07:07:29Z

0

You would probably be able to use filter with a filter function.

The code would become something like this

var cars = ["Brown", "Blue", "Bingo", "Vietnam", "America", "India", "Volvo", "Saab", "Ford", "Fiat", "Audi"];
var text = "";
cars = cars.sort();
var firstLetters = cars.map(item=>item.split('')[0]).filter((x,y,z)=>z.indexOf(x) === y);

firstLetters.map(item => {
	text += item + "<br>";
  document.getElementById("demo").innerHTML = text;
})

<html>
<body>
<div id="demo">

</div>
</body>
</html>

answered Oct 29, 2019 at 7:07

Christiaan Nieuwlaat

1,3699 silver badges14 bronze badges

1 Comment

Shoeb Mirza Over a year ago

I want to have the list display as it is and besides that I want it's first letter but if it has repeated before it should not get repeat again

Xellos · Accepted Answer · 2019-10-29 09:20:05Z

0

I assume you want to have a List in the end, with the Letters as section headers. So I'd suggest using an object approach.

function getList(){
  let cars = ["Brown", "Blue", "Bingo", "Vietnam", "America", "India", "Volvo", "Saab", "Ford", "Fiat", "Audi"];
  let list = {};
  cars.sort();
  cars.forEach((car) => {
    let section = car.charAt(0);
    if (list[section] == null){
      list[section] = [];
    }
    list[section].push(car);
  });
  return list;
}

This will create a simple object with the section headers and an array.

{ A: [ 'America', 'Audi' ],
  B: [ 'Bingo', 'Blue', 'Brown' ],
  F: [ 'Fiat', 'Ford' ],
  I: [ 'India' ],
  S: [ 'Saab' ],
  V: [ 'Vietnam', 'Volvo' ] }

answered Oct 29, 2019 at 9:20

Xellos

871 silver badge7 bronze badges

Collectives™ on Stack Overflow

Javascript Display the first letter of every array element only once

4 Answers 4

Comments

1 Comment

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

1 Comment

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related