javascript 在 React.js 中是否有使用私有变量和方法的好方法
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/32491942/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Is there a good way to use private variables and methods in React.js
提问by melanke
I've noticed that I could use private variables like this:
我注意到我可以使用这样的私有变量：
var Hello = React.createClass(new (function(){
var name;
this.getInitialState = function() {
name = "Sir " + this.props.name;
return null;
};
this.render = function() {
return <div>Hello {name}</div>;
};
})());
React.render(<Hello name="World" />, document.getElementById('container'));
Why I should not be doing this?
为什么我不应该这样做？
Thank you for any help
感谢您的任何帮助
回答by LMS5400
Private vars are perfect when you need local (private) state information for a component that does NOT change or relate to rendering directly. Keep in mind, most things do change rendering so I have found that I use private vars rarely.
当您需要不更改或与渲染直接相关的组件的本地（私有）状态信息时，私有变量是完美的。请记住，大多数事情都会改变渲染，所以我发现我很少使用私有变量。
Also, keep in mind when you add a variable to the class the way you did, its a singleton so it will be shared with all instances of that component. This can lead to issues if truly want something private for each instance -- if thats what you want, then you need to declare it in one of the lifecycle methods for the component perhaps like this
另外，请记住，当您按照您的方式向类添加变量时，它是一个单例，因此它将与该组件的所有实例共享。如果真的想要每个实例私有的东西，这可能会导致问题——如果这就是你想要的，那么你需要在组件的生命周期方法之一中声明它，可能像这样
componentDidMount() {
this.name = 'hello';
},
回答by xcatliu
If you are using es7, you can define class properties as a private variables like this:
如果您使用的是 es7，您可以将类属性定义为私有变量，如下所示：
class Hello extends React.Component {
name = 'Hyman';
render() {
return (
<div>
{this.name}
</div>
);
}
}
export default Hello;
回答by Jeff Fairley
I don't think there's anything wrong with it. The syntax is a bit funky, but it's a smart trick.
我不认为这有什么问题。语法有点时髦，但这是一个聪明的技巧。
I would question the need for a truly private variable. I can only think of two reasons why someone might want one, but both can be debunked.
我会质疑是否需要一个真正的私有变量。我只能想到有人可能想要一个的两个原因，但这两个原因都可以揭穿。
1) You make a library to be consumed by others... If someone is poking around inside your library code where they're not supposed to be, their either breaking their own experience or working around bugs they have found in your code. Either way, no harm to you or others. Worse case, they break their own app. Private variables left a really bad taste in my mouth coming from Flex. JavaScript's openness is a breath of fresh air IMO.
1）您创建了一个供其他人使用的库......如果有人在您的库代码中闲逛他们不应该在的地方，他们要么破坏自己的经验，要么解决他们在您的代码中发现的错误。无论哪种方式，都不会对您或他人造成伤害。更糟糕的是，他们破坏了自己的应用程序。来自 Flex 的私有变量在我的嘴里留下了非常糟糕的味道。JavaScript 的开放性是 IMO 的一股新鲜空气。
2) You want to hide private data inside your app... With modern browsers, anything in JavaScript can be inspected and modified at run time. It's impossible to hide data from users in JavaScript. You can only make things hard to find.
2) 你想在你的应用程序中隐藏私人数据......使用现代浏览器，可以在运行时检查和修改 JavaScript 中的任何内容。在 JavaScript 中不可能对用户隐藏数据。你只能让事情变得难找。
I know this alternative isn't truly private, but the usage is the same. Since I'm not a big fan of fighting hard to make things private, I'll include it anyway. ;g)
我知道这个替代方案并不是真正私密的，但用法是一样的。由于我不太喜欢努力使事情私有化，因此无论如何我都会将其包含在内。;G）
var Hello = React.createClass({
name: null,
getInitialState: function() {
this.name = "Sir " + this.props.name;
return null;
},
render: function() {
return <div>Hello {this.name}</div>;
};
});
React.render(<Hello name="World" />, document.getElementById('container'));
