本内容首发于工粽号：程序员大澈，每日分享一段优质代码片段，欢迎关注和投稿！

大家好，我是大澈！

本文约 600+ 字，整篇阅读约需 1 分钟。

今天分享一段优质 JS 代码片段，展示了使用逻辑或操作符 (||) 来提供默认值的机制。

老规矩，先阅读代码片段并思考，再看代码解析再思考，最后评论区留下你的见解！

var a
console.log(a) // undefined

a = a || 'default value'
console.log(a) // default value

a = a || 'new value'
console.log(a) // default value

分享原因

这段代码展示了 JavaScript 中逻辑或（||）运算符在变量赋值中的常见用法，对于理解变量的初始化和默认值设置很有帮助。

通过分析这段代码，可以深入了解逻辑或运算符的短路特性以及其在处理未初始化变量时的行为。

这种方法在项目中非常常见且实用，特别是在处理可能未赋值的变量时，能有效避免 undefined 或 null 带来的错误。

代码解析

1. var a; 

声明了一个变量 a，但此时并未给它赋值，所以 a 的值为 undefined。

2. a = a || 'default value'; 

这一行中，由于 a 此时是 undefined，逻辑或运算符 || 会返回其右侧的值，即 'default value'，并将其赋给 a。

所以此时 a 的值变为 'default value'。

3. a = a || 'new value';

在此处，因为 a 已经有值 'default value'，不再是 undefined 或 false 等假值。

所以逻辑或运算符 || 会返回其左侧的值，即已经存在的 'default value'，并再次赋给 a。

所以 a 的值仍然是 'default value'。