小编kev*_*vin的帖子

我最近一直在学习很多Javascript,而且我一直在努力理解提升变量的价值(如果有的话).

我理解(现在)JS是一个双程系统,它编译然后执行.另外,我理解var关键字'exists'在它声明的词法范围内,因此如果在引擎分配值之前调用它,那么为什么它是'undefined'.

问题是,为什么这甚至重要？有什么用途可以提升你不能不提升的变量？我觉得它只会创建不太可读的代码而没有收获......

是否存在提升变量有用的示例？

我试图通过rest参数进行映射.

MDN说:rest参数语法允许我们将无限数量的参数表示为数组.

所以如果...numbers是一个数组,当我在它上面使用map时,即numbers.map()它所映射的数组是[33,44,55].我现在如何映射...numbers数组的每个元素？我无法进入,numbers.map(numbers.slice(numbers.length - 1))因为每个numbers都是总数组.

TLDR; 我想简单地说,我如何映射其余参数的每个元素？

我没有想法.

function checkLastDigit(num1, num2, num3) {
    function collectDigits(...numbers) {
        let digitsArr = [];
        digitsArr = numbers.map(collectLastDigit());
        return digitsArr;
    }

    function collectLastDigit() {
        return this.slice(this.length - 1)
    }

    return collectDigits(num1, num2, num3);
}
checkLastDigit(33, 44, 55);

目前正在工作一个小组项目，我一直在研究小组编写的代码，我很好奇是否有更好的方法可以将prop传递给n个子组件，从而改变顶级App组件的状态。

目前，我们有这样的事情：

return (
  <div>
    <header className="navBar">
      // NavBar is an example for the question
      <NavBar
        showSplash={this.state.showSplash}
        displayAllSearchResults={this.displayAllSearchResults}
        searchBarDisplay={this.state.showCard}
        updateResults={this.updateResults}
        selectResult={this.selectResult}
        searchResults={this.state.searchResults}
        showSuggestions={this.state.showSuggestions}
      />
    </header>
    <section className="App">
      <article className="mainContent">{card}</article>
    </section>
    <div className="appBackground" />
  </div>
);

所有这些方法（可能有太多）都被传递到NavBar本身由一个SearchBar组件组成的组件中，该组件也需要传递巨大的块，以便从一开始就改变状态App。这感觉不对，是有一个解决方案或更好的方法来通过所有这些道具了吗？

为了便于阅读，我将在示例中删除很多功能。然而，本质上我有一个useEffect（如下所示），它具有跟踪state.cards卡对象数组的依赖项。我的假设是，如果该state.cards属性发生变化，则useEffect应该触发。然而，事实并非如此。

以下是正在使用的两种解决方案。我想使用第一个，因为它是恒定时间的。第二个虽然很好，但却是线性的。让我困惑的是为什么第二个选项会触发依赖关系，而第一个选项不会。两者都返回正确修改状态的克隆。

这不会触发 useEffect 依赖项state.cards。

      const newArr = { ...state };
      const matchingCard = newArr.cards[action.payload];   <-- payload = number
      matchingCard.correct += 1;
      matchingCard.lastPass = true;
      return newArr;

这确实会触发 useEffect 依赖项state.cards。

      const newArr = { ...state };
      const cards = newArr.cards.map((card) => {
        if (card.id === action.payload.id) {
          card.correct += 1;
          card.lastPass = true;
        }
        return card;
      });
      return { ...newArr, cards }; …

我正在 freecodecamp 上进行算法挑战，他们提供的解决方案非常整洁：

function bouncer(arr) {
  return arr.filter(Boolean);
}

不幸的是，作为一个菜鸟并且没有考虑那个高阶函数，我创建了这个冗长的怪物：

 function bouncer(arr) {
    let truthyArray = [];
    let falsyArray = [];
    for (let i = 0; i < arr.length; i++) {
        if (arr[i] == false || arr[i] === null || arr[i] === NaN || arr[i] === undefined) {
            falsyArray.push(arr[i]);
        } else {
            truthyArray.push(arr[i]);
        }
    }
    return truthyArray;
}

在之前的测试中，它似乎完成了工作。然而，NaN 并没有配合。

bouncer([1, null, NaN, 2, undefined])

返回：

[1, NaN, 2]

关于如何测试 NaN 有什么想法吗？

我正在尝试将我的文件从使用pg包更改为pg-promise包。我使用的初始解决方案一切正常pg。但是，切换到pg-promise并使用文档后，我在设置过程中遇到了奇怪的错误。

最新错误：

throw new TypeError('Invalid "options" parameter: ' + JSON.stringify(options));
^
TypeError: Invalid "options" parameter: "postgres://me:complete@localhost:5432/education_be"

我的配置文件：

require('dotenv').config();
const pgp = require('pg-promise');

// === My initial setup just using 'pg'
// const { Pool } = require('pg');
// const pool = new Pool({
//  name: process.env.name,
//  password: process.env.password,
//  host: process.env.host,
//  database: 'education_be',
//  port: process.env.port
// });

// === My first attempt following the guide would receive errors like: …

我已经研究了至少一个小时，到目前为止我都被难住了。也许我不理解文档或中等文章。但是，据我所知，NextJS（我已经安装了最新版本）提供了一个内置的 env 变量解决方案。所以，不需要dotenv包。

由于设置了 NextJS，我需要做的就是创建一个env.local来存储我的 API_KEY 和其他敏感信息。然后，一旦我保存了更新的文件，我就应该能够${process.env.API_KEY}在我的代码中的任何地方访问和访问该值。

如果上述陈述属实，我无法让它发挥作用。

就我而言，我使用环境变量连接到 Firebase。在下面的代码中，它正在被实现。我收到一个 500 格式错误的错误：

Connection GRPC stream error. Code: 3 Message: 3 INVALID_ARGUMENT: 
Project id parakeat-a1-7706, is malformed: it either contains invalid 
characters or is too long. Look at https://cloud.google.com
/resource-manager/docs/creating-managing-projects#identifying_projects 
for instructions in how to get a project's id.

import * as firebase from 'firebase/app';
import 'firebase/auth';
import 'firebase/firestore';
import 'firebase/storage';
import 'firebase/analytics';

const config = {
  apiKey: process.env.FIREBASE_API_KEY,
  authDomain: process.env.FIREBASE_AUTH_DOMAIN,
  databaseURL: process.env.FIREBASE_DATABASE_URL, …

Heroku 构建错误

- TSError: \xe2\xa8\xaf Unable to compile TypeScript:\n- src/server.ts(1,38): error TS7016: Could not find a declaration file for module \'express\'. \'/app/node_modules/express/index.js\' implicitly has an \'any\' type.\n- Try `npm i --save-dev @types/express` if it exists or add a new declaration (.d.ts) file containing `declare module \'express\';`\n- src/server.ts(10,14): error TS2580: Cannot find name \'process\'. Do you need to install type definitions for node? Try `npm i --save-dev @types/node`.\n

试图弄清楚如何让我的代码达到 Heroku 的状态已经被耽搁了一段时间，最新的错误如上面所示，我不确定需要更改什么才能使其正常工作。我一直在遵循指南，并在我的 package.json 脚本中有@types/express、等。@types/node然而，它并没有读取它们。不知道从这里去哪里，我们将不胜感激。

tsconfig.json …

我正在用来react-hook-form构建我的表单，它是一个很棒的工具。但是，我似乎无法<Switch />根据 redux 的返回值让元素滑动（假/真）。当我单击表单上的“重置”时，我的所有输入都会重置。我的 Switch 控件不会重置，它们仍然停留在最后一个值，无论它是否可能被重置。关于如何解决这个问题有什么想法吗？

我的开关

<FormControlLabel
  control={
    <Switch
      size="medium"
      name="familyFriendly"
      defaultChecked={formState.content.isFamilySafe}
      {...register('content.isFamilySafe')}
    />
  }
  label="Family Friendly"
/>

复位按钮

   <button
        type="button"
        onClick={() => {
          reset(formState, {
            keepErrors: true,
            keepDirty: true,
            keepIsSubmitted: false,
            keepTouched: false,
            keepIsValid: false,
            keepSubmitCount: false,
          });
        }}
      >
        reset
      </button>

使用表单钩子

  const formState = useSelector(selectDynamicForm);
  const {
    register,
    control,
    handleSubmit,
    reset,
    formState: { errors },
  } = useForm<IFormInput>({});