【编程规范】命名变量的艺术

There are only two hard things in Computer Science: cache invalidation and naming things. — Phil Karlton

给各种东西命名着实有难度，但合理地命名得到的回报是值得我们付出心思的。你是否曾经见过类似这种代码？

const convertObj = (x, y, z) => {
    const k = Object.keys(x);
    return k.map((key) => {
        return {
            [y]: key,
            [z]: x[key],
        }
    });
}

这段代码究竟是干啥的？一行一行地读，你确实能读懂，但若你合理地给变量命名，那阅读起来就轻松多了。

好的变量名极为重要，特别是动态类型语言（比如 javascript），他们没有类型定义来帮助你理解变量。可是，即使是静态类型语言，也需要使用好的命名习惯，对提高代码可阅读性有很大的帮助。

我会分享这些年我自己总结的一些通用规则，然后根据不同类型，用一些例子来分析。就先从数组开始吧。

• 数组

数组是一个可迭代列表，通常存储相同类型数据。既然他们包含多个值，复数化变量名就很合理

// 差劲
const fruit = ['apple', 'banana', 'cucumber'];

// 一般
const fruitArr = ['apple', 'banana', 'cucumber'];

// 不错
const fruits = ['apple', 'banana', 'cucumber'];

// 优秀 - "names" 表明是 字符串
const fruitNames = ['apple', 'banana', 'cucumber'];

// 优秀
const fruits = [{
    name: 'apple',
    genus: 'malus'
}, {
    name: 'banana',
    genus: 'musa'
}, {
    name: 'cucumber',
    genus: 'cucumis'
}];

• 布尔值

布尔值只有两个值，true 或 false，既然如此，使用像 is，has，can 这种前缀可以帮助阅读者推断出这个变量的类型

// 差劲
const open = true;
const write = true;
const fruit = true;

// 不错
const isOpen = true;
const canWrite = true;
const hasFruit = true;

那如果是断言函数呢（返回 boolean 的函数），当我们命名函数后，命名变量会有点麻烦

const user = {
    fruits: ['apple']
}

const hasFruit = (user, fruitName) => (
    user.fruits.includes(fruitName)
);

// 该如何命名返回的布尔值？
const x = hasFruit(user, 'apple');

我们不能把名字取为 hasProjectPermission，因为我们已经把名字给了函数。这种情况下，我喜欢给断言加个前缀，check 或 get

const checkHasFruit = (user, fruitName) => (
    user.fruits.includes(fruitName)
);

const hasFruit = checkHasFruit(user, 'apple');

• 数字

对于数字，考虑一些能描述数字的词语，比如 maximum, minimum, total

// 差劲
const pugs = 3;

// 不错
const minPugs = 1;
const maxPugs = 5;
const totalPugs = 3;

• 函数

函数名字应该使用一个动词加名词组合。当函数是在一些资源上执行动作，函数的名字应该要反映出这种意图。一个好的命名格式是遵循 动作+资源，比如 getUser

// 差劲
userData(userId)
userDataFunc(userId)
totalOfItems(items)

// 不错
getUser(userId);
calculateTotal(item)

另外，一个常见的习惯是在转换数值时，在函数名前加前缀 to

// I like it!
toDollars('euros', 20);
toUppercase('a string');

另一个常见的模式是我喜欢在遍历数组时，当函数内接收一个参数，使用数组名字的单数形式

// 差劲
const newFruits = fruits.map(x => {
    return doSomething(x);
});

// 不错
const newFruits = fruits.map(fruit => {
    return doSomething(fruit);
});

• 总结

这些命名习惯也不是全然正确，但是比起一贯地命名风格，你如何命名变量会显得不重要些。假如你一直保持着一贯的命名规范，你的代码库会变得更加容易理解，下个开接手发人员能更懂你写的东西

如果你有更好的命名习惯，请在评论区留言互相交流。

原文链接：https://hackernoon.com/the-art-of-naming-variables-52f44de00aad