变量无处不在。即便我们写一个小函数或一个小工具，也要声明、赋值和读取变量。增强对变量的重视，可以提高代码的可读性和可维护性。
1.建议使用 const，要么使用 let
用 const 或 let 声明自己的 JavaScript 变量。两者之间的主要区别是 const 变量在声明时需要初始化，并且一旦初始化就无法再重新赋值。
// const 需要初始化 const pi = 3.14; // const 不能被重新赋值 pi = 4.89; // throws "TypeError: Assignment to constant variable"
let 声明不需要对值初始化，可以多次重新赋值。
// let 要不要初始化随你 let result; // let 可被重新赋值 result = 14; result = result * 2;
const 是一次性分配变量。因为你知道 const 变量不会被修改，所以与 let 相比，对 const 变量的推测比较容易。
声明变量时优先使用 const，然后是 let 。
假设你正在 review 一个函数，并看到一个 const result = ... 声明：
function myBigFunction(param1, param2) {
/* 一写代码... */
const result = otherFunction(param1);
/* 一些代码... */
return something;
}
虽然不知道 myBigFunction() 中做了些什么，但是我们可以得出结论，result 变量是只读的。
在其他情况下，如果必须在代码执行过程中多次重新对变量赋值，那就用 let。
2. 使变量的作用域最小化
变量位于创建它的作用域中。代码块和函数体为 const 和 let 变量创建作用域。
把变量保持在最小作用域中是提高可读性的一个好习惯。
例如下面的二分查找算法的实现：
function binarySearch(array, search) {
let middle; let middleItem; let left = 0;
let right = array.length - 1;
while(left <= right) {
middle = Math.floor((left + right) / 2);
middleItem = array[middle];
if (middleItem === search) {
return true;
}
if (middleItem < search) {
left = middle + 1;
} else {
right = middle - 1;
}
}
return false;
}
binarySearch([2, 5, 7, 9], 7); // => true
binarySearch([2, 5, 7, 9], 1); // => false
变量 middle 和 middleItem 是在函数的开头声明的，所以这些变量在 binarySearch() 函数的整个作用域内可用。变量 middle 用来保存二叉搜索的中间索引，而变量 middleItem 保存中间的搜索项。
但是 middle 和 middleItem 变量只用在 while 循环中。那为什么不直接在 while 代码块中声明这些变量呢？
function binarySearch(array, search) {
let left = 0;
let right = array.length - 1;
while(left <= right) {
const middle = Math.floor((left + right) / 2);
const middleItem = array[middle];
if (middleItem === search) {
return true;
}
if (middleItem < search) {
left = middle + 1;
} else {
right = middle - 1;
}
}
return false;
}
现在 middle 和 middleItem 只存在于使用变量的作用域内。他们的生命周期极短，所以更容易推断它们的用途。
3. 易于使用
我总是习惯于在函数开始的时候去声明所有变量，尤其是在写一些比较大的函数时。但是这样做会使我在函数中使用变量的意图变得非常混乱。
所以应该在变量声明时应该尽可能靠的近使用位置。这样你就不必去猜：哦，这里声明了变量，但是…它被用在什么地方呢？
假设有一个函数，在函数有包含很多语句。你可以在函数的开头声明并初始化变量 result，但是只在 return 语句中使用了 result：
function myBigFunction(param1, param2) {
const result = otherFunction(param1);
let something;
/*
* 一些代码...
*/
return something + result;}
问题在于 result 变量在开头声明，却只在结尾用到。我们并没有充分的理由在开始的时后就声明这个变量。
所以为了更好地理解 result 变量的功能和作用，要始终使变量声明尽可能的靠近使用它位置。
如果把代码改成这样：
function myBigFunction(param1, param2) {
let something;
/*
* 一些代码...
*/
const result = otherFunction(param1);
return something + result;}
现在是不是就清晰多了。
4. 合理的命名
你可能已经知道了很多关于变量命名的知识，所以在这里不会展开说明。不过在众多的命名规则中，我总结出了两个重要的原则：
第一个很简单：使用驼峰命名法，并终如一地保持这种风格。
const message = 'Hello'; const isLoading = true; let count;
这个规则的一个例外是一些特定的值：比如数字或具有特殊含义的字符串。包特定值的变量通常用大写加下划线的形式，与常规变量区分开：
const SECONDS_IN_MINUTE = 60; const GRAPHQL_URI = 'http://site.com/graphql';
我认为第二条是：变量名称应该清楚无误地表明是用来保存哪些数据的。
下面是一些很好的例子：
let message = 'Hello'; let isLoading = true; let count;
message 名称表示此变量包含某种消息，很可能是字符串。
isLoading 也一样，是一个布尔值，用来指示是否正在进行加载。
毫无疑问，count 变量表示一个数字类型的变量，其中包含一些计数结果。
一定要选一个能够清楚表明其作用的变量名。
看一个例子，假设你看到了下面这样的代码：
function salary(ws, r) {
let t = 0;
for (w of ws) {
t += w * r;
}
return t;
}
你能很容易知道函数的作用吗？与薪水的计算有关？非常不幸，我们很难看出 ws、 r、 t、 w这些变量名的作用。
但是如果代码是这样：
function calculateTotalSalary(weeksHours, ratePerHour) {
let totalSalary = 0;
for (const weekHours of weeksHours) {
const weeklySalary = weekHours * ratePerHour;
totalSalary += weeklySalary;
}
return totalSalary;
}
我们就很容易知道它们的作用，这就是合理命名的力量。
5.采用中间变量
我一般尽可能避免写注释，更喜欢写出能够自我描述的代码，通过对变量、属性、函数、类等进行合理的命名来表达代码的意图。
如果想使代码本身称为文档，一个好习惯是引入中间变量，这在在处理长表达式时很好用。
比如下面的表达式：
const sum = val1 * val2 + val3 / val4;
可以通过引入两个中间变量来提高长表达式的可读性：
const multiplication = val1 * val2; const division = val3 / val4; const sum = multiplication + division;
再回顾一下前面的二叉搜索算法实现：
function binarySearch(array, search) {
let left = 0;
let right = array.length - 1;
while(left <= right) {
const middle = Math.floor((left + right) / 2);
const middleItem = array[middle];
if (middleItem === search) {
return true;
}
if (middleItem < search) {
left = middle + 1;
} else {
right = middle - 1;
}
}
return false;
}
里面的 middleItem 就是一个中间变量，用于保存中间项。使用中间变量 middleItem 比直接用 array[middle] 更容易。
与缺少 middleItem 变量的函数版本进行比较：
function binarySearch(array, search) {
let left = 0;
let right = array.length - 1;
while(left <= right) {
const middle = Math.floor((left + right) / 2);
if (array[middle] === search) {
return true;
}
if (array[middle] < search) {
left = middle + 1;
} else {
right = middle - 1;
}
}
return false;
}
没有中间变量的解释，这个版本稍微不太好理解。
通过使用中间变量用代码解释代码。中间变量可能会增加一些语句，但出于增强代码可读性的目的还是非常值得的的。
总结
- 变量无处不在。在 JavaScript 中使用变量时，首选 const，其次是 let。
- 尽可能缩小变量的作用域。同样，声明变量时要尽可能靠近其使用位置。
- 合理的命名是非常重要的。要遵循以下规则：变量名称应该清楚无误地表明是用来保存哪些数据的。不要害怕使用更长的变量名：要追求清晰而不是简短。
- 最后，最好用代码自己来解释代码。在高度复杂的地方，我更喜欢引入中间变量。
以上就是如何在JavaScript中正确处理变量的详细内容，更多关于JavaScript 处理变量的资料请关注其它相关文章！
免责声明：本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除！
稳了！魔兽国服回归的3条重磅消息！官宣时间再确认！
昨天有一位朋友在大神群里分享，自己亚服账号被封号之后居然弹出了国服的封号信息对话框。
这里面让他访问的是一个国服的战网网址，com.cn和后面的zh都非常明白地表明这就是国服战网。
而他在复制这个网址并且进行登录之后，确实是网易的网址，也就是我们熟悉的停服之后国服发布的暴雪游戏产品运营到期开放退款的说明。这是一件比较奇怪的事情，因为以前都没有出现这样的情况，现在突然提示跳转到国服战网的网址，是不是说明了简体中文客户端已经开始进行更新了呢？
更新日志
- 小骆驼-《草原狼2(蓝光CD)》[原抓WAV+CUE]
- 群星《欢迎来到我身边 电影原声专辑》[320K/MP3][105.02MB]
- 群星《欢迎来到我身边 电影原声专辑》[FLAC/分轨][480.9MB]
- 雷婷《梦里蓝天HQⅡ》 2023头版限量编号低速原抓[WAV+CUE][463M]
- 群星《2024好听新歌42》AI调整音效【WAV分轨】
- 王思雨-《思念陪着鸿雁飞》WAV
- 王思雨《喜马拉雅HQ》头版限量编号[WAV+CUE]
- 李健《无时无刻》[WAV+CUE][590M]
- 陈奕迅《酝酿》[WAV分轨][502M]
- 卓依婷《化蝶》2CD[WAV+CUE][1.1G]
- 群星《吉他王(黑胶CD)》[WAV+CUE]
- 齐秦《穿乐(穿越)》[WAV+CUE]
- 发烧珍品《数位CD音响测试-动向效果（九）》【WAV+CUE】
- 邝美云《邝美云精装歌集》[DSF][1.6G]
- 吕方《爱一回伤一回》[WAV+CUE][454M]