1. ?? Non air operator

In JS,?? Operators are called non airlift operators. If the first parameter is not null/undefined, the first parameter will be returned, otherwise the second parameter will be returned. For example,

null ?? 5 // => 5
3 ?? 5 // => 3

When setting default values for variables, logic or operators were commonly used, for example,

var prevMoney = 1
var currMoney = 0
var noAccount = null
var futureMoney = -1
function moneyAmount(money) {
return money || `Account not opened`
}
console.log(moneyAmount(prevMoney)) // => 1
console.log(moneyAmount(currMoney)) // => Account not opened
console.log(moneyAmount(noAccount)) // => Account not opened
console.log(moneyAmount(futureMoney)) // => -1

Above, we created the function moneyAmount, which returns the current user balance. We use the | operator to identify users without accounts. However, what does this mean when a user does not have an account? It is more accurate to treat no account as empty rather than 0, because bank accounts may not have (or negative) currency. In the above example, the | operator treats 0 as a false value and should not include the user's account with $0. Let's use?? Non null operators to solve this problem:

var currMoney = 0
var noAccount = null
function moneyAmount(money) {
  return money ?? `Account not opened`
}
moneyAmount(currMoney) // => 0
moneyAmount(noAccount) // => `Account not opened`

2. ??= Null assignment operator

var x = null
var y = 5
console.log(x ??= y) // => 5
console.log(x = (x ?? y)) // => 5

This assignment operator assigns a value only if the value is null or undefined. The above example emphasizes that this operator is essentially a null assignment syntax sugar. Next, let's look at the difference between this operator and the default parameter:

function gameSettingsWithNullish(options) {
  options.gameSpeed ??= 1
  options.gameDiff ??= 'easy' 
  return options
}
function gameSettingsWithDefaultParams(gameSpeed=1, gameDiff='easy') {
  return {gameSpeed, gameDiff}
}
gameSettingsWithNullish({gameSpeed: null, gameDiff: null}) // => {gameSpeed: 1, gameDiff: 'easy'}
gameSettingsWithDefaultParams(undefined, null) // => {gameSpeed: null, gameDiff: null}

3. ?. Chain judgment operator

Chain judgment operator Allows developers to read property values deeply nested in the object chain without having to validate each reference. When the reference is empty, the expression stops evaluating and returns undefined. For example:

var travelPlans = {
  destination: 'DC',
  monday: {
    location: 'National Mall',
    budget: 200
  }
}
console.log(travelPlans.tuesday?.location) // => undefined

function addPlansWhenUndefined(plans, location, budget) {
  if (plans.tuesday?.location == undefined) {
    var newPlans = {
      plans,
      tuesday: {
        location: location ?? "park",
        budget: budget ?? 200
      },
    }
  } else {
    newPlans ??= plans; // only newPlans yes undefined Only when
    console.log("Scheduled")
  }
  return newPlans
}
// Translator's note, object travelPlans The initial value of is from the above example
var newPlans = addPlansWhenUndefined(travelPlans, "Ford theater", null)
console.log(newPlans)
// => { plans: 
// { destination: 'DC',
// monday: { location: 'National shopping center', budget: 200 } },
// tuesday: { location: 'Ford theater', budget: 200 } }
newPlans = addPlansWhenUndefined(newPlans, null, null)
// logs => Scheduled
// returns => newPlans object

4. ?: Ternary operator

var x = 6
var x = (x !== null || x !== undefined) ? x : 3
console.log(x) // => 6

function nullishAssignment(x,y) {
  return (x == null || x == undefined) ? y : x 
}
nullishAssignment(null, 8) // => 8
nullishAssignment(4, 8) // => 4

function addPlansWhenUndefined(plans, location, budget) {
 var newPlans =
   plans.tuesday?.location === undefined
     ? {
         plans,
         tuesday: {
           location: location ?? "park", 
           budget: budget ?? 200
         },
       }
     : console.log("Scheduled");
 newPlans ??= plans;
 return newPlans;
}