Question

我在这里关注meteorjs的教程： https://www.meteor.com/tutorials/react/forms-and-events

其中一个代码是使用const。 const text = ReactDOM.findDOMNode(this.refs.textInput).value.trim();

据我在SO网站其他网站上的阅读所知，const价值无法改变。但是，当我在应用程序输入框中键入任何文本时，不会因重新分配const值而抛出错误。

为什么会发生这种情况，我是否理解const错了？我希望有人可以向我解释并提前感谢。

示例代码：

import React, { Component, PropTypes } from 'react';
import ReactDOM from 'react-dom';
import { createContainer } from 'meteor/react-meteor-data';

import { Tasks } from '../api/tasks.js';
...some lines skipped...

// App component - represents the whole app
class App extends Component {
  handleSubmit(event) {
    event.preventDefault();

    // Find the text field via the React ref
    const text = ReactDOM.findDOMNode(this.refs.textInput).value.trim();

    Tasks.insert({
      text,
      createdAt: new Date(), // current time
    });

    // Clear form
    ReactDOM.findDOMNode(this.refs.textInput).value = '';
  }

  renderTasks() {
    return this.props.tasks.map((task) => (
      <Task key={task._id} task={task} />

Answer 1

该const用于在每次输入输入时调用的函数内定义局部变量。当函数完成执行时它不再“存在”，所以下次调用该函数时你不会覆盖它，你再次创建它。

Answer 2

@epiqueras提供了一个很好的答案，但知道const不是关于不变性也很重要。好消息：https://mathiasbynens.be/notes/es6-const

ES6 const并不表示值是“常量”或不可变的。一个   const值肯定会改变。

const和let之间的唯一区别是const使得   没有重新绑定的合同。

Answer 3

您对const关键字的假设是正确的！

此函数是handleSubmit()函数，因此只有在提交表单（我推测）时才会调用它。在该实例中，一旦函数完成，const变量就会被创建，填充，使用，然后超出范围。

如果再次调用handleSubmit()，它将创建一个新变量。

Answer 4

let和const都创建了块范围的变量 - 它们只存在于围绕它们的最里面的块中。

function func() {
  if (true) {
    const tmp = 123;
  }
  console.log(tmp); // ReferenceError: tmp is not defined
}

在您的情况下，每次运行handleSubmit函数时，text是函数范围内新创建的变量，而不是旧的，已销毁的text。

有关此here的详情。

Const值可以改变

4 个答案: