原副标题：4 个不常见的 JavaScript 操作符，你会两个？
JavaScript在急速的变异和升级换代，愈来愈多的新优点让他们的标识符显得更为简约。因而，那时这首诗，我将跟我们撷取 4 个不常见的 JavaScript 操作符。让他们一同科学研究它。
1.较旧的镜像操作符
那个机能十分称心，它能避免我的标识符手忙脚乱，即使能普遍化它。
比如，他们想列印两个人的英文名字，我敢赌这很难！没十分困难。
const showName = (data) => {
console.log(data.user.name)
}
showName({
user: {
name: fatfish
}
})
意外的是，我太贪玩了，没依照showName的明确要求传不合法的模块，结论闯祸了。
const showName = (data) => {
console.log(data.user.name)
}
showName(fatfish)
你一定是一个有经验的软件工程师，所以很难写出像下面这样的标识符。
const showName = (data) => {
console.log(data && data.user && data.user.name)
}
showName(fatfish)
有没更优雅的方式？如果数据层级嵌套太深，就是一段臭标识符。
const showName = (data) => {
console.log(data && data.user && data.user.person …)
}
showName(fatfish)
别担心，Optional Chaining Operator 能帮助他们。下面的标识符不再抛手忙脚乱误，这很棒。
const showName = (data) => {
console.log(data?.user?.name)
}
showName(fatfish)
什么是较旧镜像操作符？
来自 mdn的解释：较旧的镜像操作符 (?.) 访问对象的属性或调用函数。如果对象是 undefined 或 null，它返回 undefined 而不是抛手忙脚乱误。
const adventurer = {
name: Alice,
cat: {
name: Dinah
}
}
const dogName = adventurer?.dog?.name
console.log(dogName)
// expected output: undefined
console.log(adventurer.someNonExistentMethod?.())
// expected output: undefined
2.合并赋值 (??=)
来自mdn的解释：空值合并赋值 (x ??= y) 操作符仅在 x 为空值（null 或未定义）时才赋值。
const obj = {
name: fatfish
}
obj.name ??= medium
obj.age ??= 100
console.log(obj.name, obj.age)
是的，最后只分配了 age 属性。
小伙伴们，你们觉得哪一行标识符更接近??=?的机能呢？答案1还是答案2？
// 1.
x ?? (x = y)
// 2.
x = x ?? y
我想你猜对了，答案是1。
因为答案2在任何情况下都会赋值x，而答案1只有在x为真时才会赋值。
它能为他们做什么？
那么，他们能用它做什么呢？是的，它可以做与默认模块完全相同的事情。
const showName = (name) => {
name ??= fatfish
console.log(name)
}
showName(medium) // medium
showName() // fatfish
它几乎等同于以下标识符。
const showName = (name = fatfish) => {
console.log(name)
}
showName(medium) // medium
showName() // fatfish
好吧，我不得不承认编写默认模块让我更快乐。
3.逻辑或赋值(||=)
来自 mdn的解释：逻辑或赋值 (x ||= y) 操作符仅在 x 为假时才赋值。
const obj = {
name: ,
age: 0
}
obj.name ||= fatfish
obj.age ||= 100
console.log(obj.name, obj.age) // fatfish 100
小伙伴们能看到，当x的值为假值时，赋值成功。
它能为他们做什么？
来自mdn：如果“lyrics”元素为空，则显示默认值：
document.getElementById(“lyrics”).textContent ||= “No lyrics.”
短路在这里特别有用，因为元素不会进行不必要的更新，也不会导致不必要的副作用，比如，额外的解析或渲染工作，或失去焦点等。
4.逻辑与赋值(&&=)
来自mdn：逻辑与赋值 (x &&= y) 操作符仅在 x 为真时才赋值。
与逻辑或赋值 (||=) 相反，只有 x 为真时才会正确赋值。
const obj = {
name: fatfish,
age: 100
}
obj.name &&= medium // medium
obj.age &&= 1000 // 1000
console.log(obj.name, obj.age) // medium 1000
免费好课推荐：
