如何创建 { 0: false, 1: false, 2: false, ..., 99: false } JavaScript 中的最短路径（最好使用 Lodash？）

Question

问题在标题里。我想制作一个 object，它具有从 0 到 99 的所有键，所有值都应该是 false。

我可以用几行代码在 JavaScript ES6 中弄清楚如何做到这一点，但想知道是否有人能想到 one-line 解决方案？我尝试了不同的 lodash 方法，例如 keyBy、map，但到目前为止都没有成功。

Answer 1

像这样简单:

const obj = {};

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

console.log(obj);

Answer 2

另一行是：

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

我们在哪里

Create 一个数组：new Array(length)
Fill 它与 false: fill(false)
Convert to an object: Object.assign({}, ...);

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

Answer 3

根据我的评论，我认为您应该使用数组。只需拿起 rowIndex，复制现有数组，更新索引处的值，然后更新状态。

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>

如何创建 { 0: false, 1: false, 2: false, ..., 99: false } JavaScript 中的最短路径（最好使用 Lodash？）

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

javascript

object

lodash