How to create { 0: false, 1: false, 2: false, ..., 99: false } the shortest way in JavaScript (preferably using Lodash?)

Question

Question is in the title. I want to make an object that has all keys from 0 to 99 and all values should be false.

I can figure out how to do this in JavaScript ES6 in a couple lines, but wondering if somebody can think of a one-line solution? I've tried with different lodash methods such as keyBy, map, but have been unsuccessful so far.

Why not just use an array? An object with keys as numbers is really all an array is. Then it's [`new Array(99).fill(false)`](https://medium.com/@wisecobbler/4-ways-to-populate-an-array-in-javascript-836952aea79f). — Andy, Sep 01 '21 at 15:17
The keys in `{ 0: false, 1: false }` are strings. You should use an array `[false, false]` if you want numbers. — jabaa, Sep 01 '21 at 15:20
Because I'm mapping which rows of a 100-row table are selected in React, so when they get selected I set the ones with the right index to `true`. It's stored in a state, and I find that adding/removing elements from arrays to be a bit messy in JS. It's fine if the keys are strings, I'm just trying to change the value to `true` of the particular rows that are selected, which is easy to understand with an object — gnarois, Sep 01 '21 at 15:20
You could not add those keys from 0 to 99, and when calling the object you could just compare if exist; ```obj.0 ? true : false``` — Rateb Habbab, Sep 01 '21 at 15:49

score 2 · Answer 1 · edited Sep 01 '21 at 15:33

2

Simple like this :

const obj = {};

for (let i = 0; i < 100; i++) {
  obj[i] = false;
}

console.log(obj);

edited Sep 01 '21 at 15:33

Andy

61,948
13
68
95

answered Sep 01 '21 at 15:25

Patfreeze

680
6
16

score 1 · Accepted Answer · answered Sep 01 '21 at 15:43

Another one-liner is:

Object.assign({}, new Array(100).fill(false));

Where we

Create an array: new Array(length)
Fill it with false: fill(false)
Convert to an object: Object.assign({}, ...);

const obj = Object.assign({}, new Array(100).fill(false));
console.log(obj);

score -1 · Answer 3 · answered Sep 01 '21 at 15:52

Just based on my comment I think you should use an array. Just pick up the rowIndex, copy the existing array, update the value at the index, and then update the state.

const { useEffect, useState } = React;

function Example() {

  const [ data, setData ] = useState(new Array(5).fill(false));

  function handleClick(e) {
    const index = e.target.parentNode.rowIndex;
    const newArray = [...data];
    newArray[index] = !newArray[index];
    setData(newArray);
  }

  useEffect(() => {
    console.log(data);
  }, [data]);

  return (
    <div>
      <table onClick={handleClick}>
        <tbody>
          <tr><td>Bob</td><td>25</td></tr>
          <tr><td>Karen</td><td>26</td></tr>
          <tr><td>Dave</td><td>27</td></tr>
          <tr><td>Jo</td><td>35</td></tr>
          <tr><td>Steve</td><td>75</td></tr>
        </tbody>
      </table>
    </div>
  );
};

// Render it
ReactDOM.render(
  <Example />,
  document.getElementById("react")
);

tr { background-color: #efefef; }
tr:hover { cursor: pointer; background-color: #bfbfbf; }

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/17.0.1/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/17.0.1/umd/react-dom.production.min.js"></script>
<div id="react"></div>

Because the OP said they were using React. Read the comments. All the values are `false` initially but they change when the rows get clicked. — Andy, Sep 01 '21 at 15:54

How to create { 0: false, 1: false, 2: false, ..., 99: false } the shortest way in JavaScript (preferably using Lodash?)

3 Answers3