在日常的前端开发中，我们经常需要从对象中获取某个属性的值，并且希望当这个属性不存在时有一个默认值。本文将介绍如何使用 JavaScript 来实现这个功能。
1. 直接访问属性
JavaScript 中，我们可以通过对象的属性名直接访问该属性的值。如果该属性存在，那么就会返回它的值，否则会返回 undefined。例如：
const person = {
name: 'Alice',
age: 25
};
console.log(person.name); // 输出：'Alice'
console.log(person.gender); // 输出：undefined因此，我们可以通过简单的 if 判断来给没有值的属性设置一个默认值，例如：
-- -------------------- ---- ------- ----- ------ - - ----- -------- ---- -- -- -- -------------- --- ---------- - ------------- - ---------- - --------------------------- -- ------------
但是，上面的代码显得比较冗长，也不够优雅。下面我们将介绍更好的方式。
2. 使用逻辑或运算符
JavaScript 中的逻辑或运算符 || 可以用来实现获取属性值时的默认值。具体来说，当左侧表达式（即属性值）为假值时，它会返回右侧表达式（即默认值）。例如：
const person = {
name: 'Alice',
age: 25
};
console.log(person.gender || 'unknown'); // 输出：'unknown'这个写法的意思是，如果 person.gender 为假值（如 undefined 或 null），那么返回 'unknown'；否则返回 person.gender 的值。
需要注意的是，如果属性值为 0 或空字符串 ''，它们也会被认为是假值。因此，在使用逻辑或运算符时需要特别小心。
3. 使用 ES6 中的默认参数
在 ES6 中，函数的参数可以有默认值。我们可以利用这个特性来实现获取属性值时的默认值。例如：
-- -------------------- ---- ------- ----- ------ - - ----- -------- ---- -- -- -------- -------------- ------------ - ---------- - ------ ---------- -- ------------- - ------------------------------- -- ------------
可以看到，通过给参数 defaultValue 赋一个默认值，我们就可以直接使用逻辑或运算符来获取属性值了。这样的好处是，使得代码更加简洁易懂，并且方便复用。
总结
本文介绍了三种从对象中获取值时设定默认值的方法：直接访问属性、使用逻辑或运算符和使用 ES6 默认参数。其中，后两种方式更适合大规模应用，可以使代码更加优雅、简洁。在实际开发中，我们应该根据具体需求选择适合的方式。
示例代码见下：
-- -------------------- ---- ------- -- ------ ----- ------- - - ----- -------- ---- -- -- -- --------------- --- ---------- - -------------- - ---------- - ---------------------------- -- ------------ -- -------- ----- ------- - - ----- ------ ---- --- ------- -- -- -------------------------- -- ----------- -- ------------ -- -- --- ---- ----- ------- - - ----- ---------- ---- -- -- -------- -------------- ------------ - ---------- - ------ ---------- -- ------------- - -------------------------------- -- ------------
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/27426