1

I am relatively new to Javascript and I was trying to understand the use of || in the current code.

So, I was going through this amazing article on web about reduce in Javascript where he wrote this example 

const fruitBasket = ['banana', 'cherry', 'orange', 'apple', 'cherry', 'orange', 'apple', 'banana', 'cherry', 'orange', 'fig' ];

const count = fruitBasket.reduce( (tally, fruit) => {
  tally[fruit] = (tally[fruit] || 0) + 1 ;
  return tally;
} , {})

count // { banana: 2, cherry: 3, orange: 3, apple: 2, fig: 1 }

[Question] Here, I am unable to understand two things 

tally[fruit] = (tally[fruit] || 0) + 1 ;

What is this || doing here and why did he used it? (I know this is an or operator)

And secondly what does this mean , {}) at the end of function?

Alwaysblue
  • 9,948
  • 38
  • 121
  • 210
  • if `tally[fruit]` is undefined, then fall back to 0. `{}` is the accumulator, the base object your `reduce` function starts with. – Jeremy Thille May 31 '18 at 14:42
  • Please someone mention falsey values in their answer, rather than specifically `undefined` or `null`. It works for all falsey values. – Jamie Dixon May 31 '18 at 14:44
  • See this https://stackoverflow.com/questions/21273498/what-is-the-purpose-of-x-x-0 – Kevin May 31 '18 at 14:44
  • 2
    `Array.prototype.reduce` takes two arguments. The first is a function and the second is an initial value that will receive the values from the `reduce` function. The `||` is an or operator. So here it is saying if tally[fruit] does not exist + 1 if it does then add 1 to the current value. – Cory Kleiser May 31 '18 at 14:47
  • ++ for using reduce. Now that you know how to use reduce, you can forget about all other array methods – Max Baldwin May 31 '18 at 14:57

4 Answers4

7

The use of the || here is called a short-circuit evaluation. This means that if tally[fruit] is truthy it will use its value, otherwise it will use 0 (and then add 1).

The {} is the last parameter for the reduce() function which is the starting value (in this case an emtpy object). Generally speaking, this can be any type, including Strings, Numbers, Arrays and Objects. The MDN has a good explanation:

initialValueOptional

Value to use as the first argument to the first call of the callback. If no initial value is supplied, the first element in the array will be used. Calling reduce() on an empty array without an initial value is an error.

Community
  • 1
  • 1
Chris
  • 57,622
  • 19
  • 111
  • 137
3

1.- || means "or". The expression means assign the value of tally[fruit], or if the value is undefined, then assign 0

2.- {} is the initial value (an empty object) of the reduce function.

This initial value can be of any type, a number, an array, an object. With every iteration of reduce, this initial value will be modified (for that reason is also called "accumulator"). In your function, tally is the accumulator, the object, and fruit is each one of the items of the fruitBasket array being iterated.

For more info, check the docs of reduce

Damian Peralta
  • 1,846
  • 7
  • 11
1

|| stands for OR. so if tally[fruit] returns null, undefined, '', or 0 it will be set to 0 and added 1

sander
  • 719
  • 2
  • 9
  • 21
1

Its the logical OR operator in JavaScript.

(tally[fruit] || 0) this statement essentially means that if tally[fruit] is null or undefined, then it will be assigned to 0.

Kunal Mukherjee
  • 5,775
  • 3
  • 25
  • 53