1

On the Udemy Javascript course, there was a challenge, which was about creating an object with key-value pair from the array and finding the number of occurrences of each key. Thus, the key is the array element, and the value of each key is the number of occurrences of that key.

However, the solution to the challenge was the following two methods.

const sequential = ["first", "second", "third", "forth", "first", "first"];
const sequentialObject1 = {};
const sequentialObject2 = {};

for (const seq of sequential) {
  // Method One:
  sequentialObject1[seq] ? sequentialObject1[seq]++ : (sequentialObject1[seq] = 1);

  // Method Two:
  sequentialObject2[seq]++ || (sequentialObject2[seq] = 1);
}
console.log(sequentialObject1);
console.log(sequentialObject2);

The thing that I couldn't understand is, how the provided solution could find the number of occurrences when there is no comparison process to compare and find the occurrences. The solution seems to me like has nothing to do with finding the number of occurrences, but in fact, it can find them.

I understand what the increment operator does, but don't understand the comparison process, or how it happens!

So, could you please make me understand what is happening behind the scenes?

Thanks for your help.

freedomn-m
  • 27,664
  • 8
  • 35
  • 57
Ameen Shamsan
  • 47
  • 4
  • Does this answer your question? [What does this symbol mean in JavaScript?](https://stackoverflow.com/questions/9549780/what-does-this-symbol-mean-in-javascript) – 0stone0 Jul 04 '23 at 16:07
  • I'd recommend reading about `||` in the marked duplicate. If the `++` fails, it will run the second part, setting the value to `1`. – 0stone0 Jul 04 '23 at 16:08
  • 1
    `sequentialObject[seq]++` This will either return undefined, or if it exits return that element and then increment it. If it doesn't exist it then would return `NaN`, because of the `||` or operator, this will get executed if it didn't exists -> `sequentialObject2[seq] = 1` IOW: setting it 1 when that element does not yet exist. – Keith Jul 04 '23 at 16:08
  • 1
    Method 1: expand the `?:` to an `if-else` if you find `?:` hard to read. Method 2: can be a little confusing (and I don't recommended using it) - `++` will return null if the source is null (doesn't existing as a key the key-value array) so the part after `||` runs when it's null - that's the comparison. – freedomn-m Jul 04 '23 at 16:13
  • 1
    To be fair, using the tenary operator, (method one), and short circuit boolean operations (method 2), are really not great ideas, they look fancy, but as you have seen can make it more difficult for others to maintain. Although slightly longer, a good old `if` / `else` would make the code more readable. – Keith Jul 04 '23 at 16:13

1 Answers1

1

The trick here is using the object sequentialObject. It is a dictionary which keeps track of value in sequential. When the first occurrence of value is found inside the for loop it is added to the sequentialObject with count 1 and every time the value is found again the value is incremented, once all the items are done it gives the dictionary of values and their count.

sequentialObject[seq] ? sequentialObject[seq]++ : (sequentialObject[seq] = 1) translates to: if seq exists in sequentialObject then increment its value else set its value to 1.

Nilam
  • 26
  • 2