具有复杂名称的全局变量与用于搜索的输入字段之间的真正区别是什么?
whats the real difference between a global variable with complex name VS an input field used for searching?
如果我有一个网站,其中包含产品过滤器等。如果我将值存储在全局变量而不是元素值中,反之亦然。当然,命名空间是一个问题,但如果它很复杂,它就不太可能被覆盖。我读过允许访问变量以便更改它们是不好的。客户端上的任何东西都不可访问吗?此外,我看不出有人更改我的全局变量值与更改输入值之间的区别。如果我存储我的用户位置的 GPS 坐标以显示地图,并且用户更改它,我将如何存储“先前”位置和“新”位置,以便如果用户想要恢复,他们可以。只要我在数据到达服务器时验证我的数据,真正的问题是什么?有什么想法吗?
I've read it bad to allow access to the variables so they can be changed. Isnt anything on the client accessible?
这里有 2 个问题。
最重要的(通常)是代码可维护性。当你有一个大脚本时,如果你使用全局变量,名称冲突是很有可能的。是的,您可以使用复杂的变量名,但是当代码使用简单准确的变量名时,代码更容易阅读。
除了碰撞之外,在给定块中使用大量变量会增加认知开销。如果变量仅与代码的 一个特定部分 相关,则将变量隔离到该部分可以使代码更容易一目了然。例如,可以替换
let isActive = false;
// 200 lines of code
button.addEventListener('click', () => {
isActive = !isActive;
alert('isActive is ' + isActive);
});
和
// 200 lines of code
(() => {
let isActive = false;
button.addEventListener('click', () => {
isActive = !isActive;
alert('isActive is ' + isActive);
});
})();
(或者更好,使用 ES6 模块来限制范围)
有关此主题的详细讨论,请参阅 this post。
另一个问题是,正如您提到的,如果变量是全局变量,用户可以更改它。有时这是一个问题。例如,如果您有一个跟踪用户收集的硬币的游戏,用户只需打开控制台并执行 window.coins = 1e9
(万一他们了解 JS 并愿意检查源代码来计算知道如何做这样的事情)。将变量放入封闭的 IIFE 将使这种技术更难实现 - 但是 not impossible.
从根本上说,客户可以选择 运行 他们想要的任何代码 - 这是他们的机器。因此,您 确实 需要服务器端验证 - 正如您所说的那样,这很好。
As long as I validate my data when it hits the servers, whats really the issue?
除了可维护性问题之外,可能 不是一个值得担心的问题,因为很少有人知道并足够关心去修补其他网站上的代码(并且即便如此 - 这是他们自己的电脑,所以谁在乎呢?)。许多网站使用全局变量。它可能不够优雅,但它仍然可以完美地工作(只要发送到服务器的任何重要内容也在服务器上得到验证)。
如果我有一个网站,其中包含产品过滤器等。如果我将值存储在全局变量而不是元素值中,反之亦然。当然,命名空间是一个问题,但如果它很复杂,它就不太可能被覆盖。我读过允许访问变量以便更改它们是不好的。客户端上的任何东西都不可访问吗?此外,我看不出有人更改我的全局变量值与更改输入值之间的区别。如果我存储我的用户位置的 GPS 坐标以显示地图,并且用户更改它,我将如何存储“先前”位置和“新”位置,以便如果用户想要恢复,他们可以。只要我在数据到达服务器时验证我的数据,真正的问题是什么?有什么想法吗?
I've read it bad to allow access to the variables so they can be changed. Isnt anything on the client accessible?
这里有 2 个问题。
最重要的(通常)是代码可维护性。当你有一个大脚本时,如果你使用全局变量,名称冲突是很有可能的。是的,您可以使用复杂的变量名,但是当代码使用简单准确的变量名时,代码更容易阅读。
除了碰撞之外,在给定块中使用大量变量会增加认知开销。如果变量仅与代码的 一个特定部分 相关,则将变量隔离到该部分可以使代码更容易一目了然。例如,可以替换
let isActive = false;
// 200 lines of code
button.addEventListener('click', () => {
isActive = !isActive;
alert('isActive is ' + isActive);
});
和
// 200 lines of code
(() => {
let isActive = false;
button.addEventListener('click', () => {
isActive = !isActive;
alert('isActive is ' + isActive);
});
})();
(或者更好,使用 ES6 模块来限制范围)
有关此主题的详细讨论,请参阅 this post。
另一个问题是,正如您提到的,如果变量是全局变量,用户可以更改它。有时这是一个问题。例如,如果您有一个跟踪用户收集的硬币的游戏,用户只需打开控制台并执行 window.coins = 1e9
(万一他们了解 JS 并愿意检查源代码来计算知道如何做这样的事情)。将变量放入封闭的 IIFE 将使这种技术更难实现 - 但是 not impossible.
从根本上说,客户可以选择 运行 他们想要的任何代码 - 这是他们的机器。因此,您 确实 需要服务器端验证 - 正如您所说的那样,这很好。
As long as I validate my data when it hits the servers, whats really the issue?
除了可维护性问题之外,可能 不是一个值得担心的问题,因为很少有人知道并足够关心去修补其他网站上的代码(并且即便如此 - 这是他们自己的电脑,所以谁在乎呢?)。许多网站使用全局变量。它可能不够优雅,但它仍然可以完美地工作(只要发送到服务器的任何重要内容也在服务器上得到验证)。