你有没有花一个下午阅读Mozilla文档？如果是这样，你会发现网上有大量的JS资料，这让我们很容易忽略掉那些比较基础的JS操作符。这些运算符不常见但功能强大！语法看起来差不多，但是功能不同，一定要仔细阅读。1.??非空运算符在JS中，??运算符称为非空运算符。如果第一个参数不是null/undefined'，不要混淆），将返回第一个参数，否则返回第二个参数。例如，空??5//=>53??5//=>3为变量设置默认值时，||过去常用逻辑或运算符，例如varprevMoney=1varcurrMoney=0varnoAccount=nullvarfutureMoney=-1functionmoneyAmount(money){returnmoney||`账户未开通`}console.log(moneyAmount(prevMoney))//=>1console.log(moneyAmount(currMoney))//=>账户未开通console.log(moneyAmount(noAccount))//=>账户未打开console.log(moneyAmount(futureMoney))//=>-1上面我们创建了函数moneyAmount，它返回当前用户余额。我们使用||运营商识别没有帐户的用户。但是，用户没有帐户意味着什么？将无帐户视为空而不是0更准确，因为银行帐户可能没有（或负）货币。在上面的示例中，||运算符将0视为错误值，不应包括用户拥有$0的帐户。让我们使用??非空运算符来解决这个问题：varcurrMoney=0varnoAccount=nullfunctionmoneyAmount(money){returnmoney??`帐户未打开`}moneyAmount(currMoney)//=>0moneyAmount(noAccount)//=>`帐户未激活`简而言之??运算符允许我们指定默认值，同时忽略错误值，例如0和空字符串。2.??=空赋值运算符??=又称为空赋值运算符，与上述非空运算符有关。查看它们是如何链接的：varx=nullvary=5console.log(x??=y)//=>5console.log(x=(x??y))//=>5仅当值为This赋值运算符仅在值为null或未定义时才赋值。上面的例子强调了这个运算符本质上是空赋值的语法糖（译者注，类似的语法糖：a=a+b可以写成a+=b）。接下来我们看一下这个操作符和默认参数的区别（译者注，默认参数是ES6引入的新语法，只有当函数参数未定义时，才为其设置一个默认值）：functiongameSettingsWithNullish(options){options.gameSpeed??=1options.gameDiff??='easy'returnoptions}functiongameSettingsWithDefaultParams(gameSpeed=1,gameDiff='easy'){return{gameSpeed,gameDiff}}gameSettingsWithNullish({gameSpeed:null,gameDiff:null})//=>{gameSpeed:1,gameDiff:'easy'}gameSettingsWithDefaultParams(undefined,null)//=>{gameSpeed:null,gameDiff:null}上述功能的方式有一个值得注意的区别处理空值。前端训练默认参数会覆盖空参数的默认值（译者注，这里的空参数只能是undefined），空赋值运算符不会。默认参数和空赋值都不会覆盖未定义的值。3.?.链式判断运算符链式判断运算符?。允许开发人员读取深度嵌套在对象链中的属性值，而无需验证每个引用。当引用为null时，表达式停止计算并返回undefined。例如：vartravelPlans={destination:'DC',monday:{location:'NationalMall',budget:200}}console.log(travelPlans.tuesday?.location)//=>undefined学会了把它结合起来，把星期二添加到你的旅行计划中！functionaddPlansWhenUndefined(plans,location,budget){if(plans.tuesday?.location==undefined){varnewPlans={plans,tuesday:{location:location??“公园”，预算：预算??200},}}else{newPlans??=计划；//只有当newPlansundefined时，console.log("Arrangedplan")}returnnewPlans}//译者注，对象travelPlans的初始值，来自上面的例子varnewPlans=addPlansWhenUndefined(travelPlans,"FordTheatre",null)console.log(newPlans)//=>{plans://{destination:'DC',//monday:{location:'NationalMall',budget:200}},//周二：{location:'FordTheater',budget:200}}newPlans=addPlansWhenUndefined(newPlans,null,null)//logs=>scheduledplans//returns=>newPlansobject上面的例子包含了我们到目前为止所学的所有运算符。我们现在已经创建了一个函数，将时间表添加到当前没有嵌套属性的对象tuesday.location中。我们还使用非空运算符来提供默认值。此函数将错误地接受像“0”这样的值作为有效参数。这意味着可以将预算设置为零而不会出现任何错误。4.?：三元运算符?：也称为条件运算符，它接受三个操作数：条件？条件为真时执行的表达式:条件为假时执行的表达式。实际效果：functioncheckCharge(charge){return(charge>0)?'Available':'Needtorecharge'}console.log(checkCharge(20))//=>Availableconsole.log(checkCharge(0))//=>Needtorecharge如果你写过JS，你可能见过三元运算符。但是，您知道三元运算符可以用于变量赋值吗？varbudget=0var运输=(budget>0)?'train':'walking'console.log(transportion)//=>'walking'我们甚至可以用它来实现空赋值行为：varx=6varx=(x!==null||x!==undefined）？x:3console.log(x)//=>6让我们通过创建一个函数来概括这个操作：functionnullishAssignment(x,y){return(x==null||x==undefined)?y:x}nullishAssignment(null,8)//=>8nullishAssignment(4,8)//=>4在结束之前，让我们使用三元运算符函数重构前面的示例：functionaddPlansWhenUndefined(plans,location,budget){varnewPlans=plans.tuesday?.location===未定义？{计划，星期二：{位置：位置??“公园”，预算：预算??200},}:console.log("安排好的计划");newPlans??=计划；返回新计划；}
