codingedgar

console.group('Logical OR assignment (||=)');

const a = { duration: 50, title: '' };

a.duration ||= 10;
console.log(a.duration);

a.title ||= 'title is empty.';
console.log(a.title);

codingedgar

console.group('Logical AND assignment (&&=)');

let x = 0;
let y = 1;

x &&= 0;
console.log(x);
x &&= 1;
console.log(x);
y &&= 1;

codingedgar

class Cat {
  constructor(name) {
    this._name = name
  }
  get name() {
    console.log('get called', this._name);
    return this._name
  }
  
  set name(value) {

codingedgar

const aNewCat = new Cat();

aNewCat.name ??= 'Artemis';

console.assert(aNewCat.name === 'Artemis');

aNewCat.name ??= 'Nirvana';

console.assert(aNewCat.name === 'Artemis');

codingedgar

console.group('Lazy Setter with Nullish Coalescing Operator');

const nameThisCatPlease = new Cat('Pepo');
console.assert(nameThisCatPlease.name === 'Pepo');

nameThisCatPlease.name ?? ( nameThisCatPlease.name = 'Cleo')
console.assert(nameThisCatPlease.name === 'Pepo');

nameThisCatPlease.name = undefined;

codingedgar

console.group('Eager Setter with Nullish Coalescing Operator');

const anotherRandomCat = new Cat('Pepo');

anotherRandomCat.name = anotherRandomCat.name ?? 'Luna'

console.assert(anotherRandomCat.name === 'Pepo');

console.groupEnd();

codingedgar

console.group('Exemplifying the difference between falsy and nullish');

const catWithNoChars = new Cat('');
console.assert(catWithNoChars.name === '');

// '' is falsy but no nullish
if (!catWithNoChars.name) {
  catWithNoChars.name = 'Pepo';
}

codingedgar

console.group('State of JS');

const randomCat = new Cat();
console.assert(randomCat.name === undefined);

if (!randomCat.name) {
  randomCat.name = 'Pepo';
}

console.assert(randomCat.name === 'Pepo');

codingedgar

const BOARD_SIZE = 208 as const;
const BOARD_PADDING = 4 as const;
const LINE_WIDTH = 8 as const;
const LINE_CAP_SIZE = LINE_WIDTH / 2;
const CELL_SIZE = 64 as const;
const CELL_PADDING = 4 as const;
const CELL_CENTER = CELL_SIZE / 2;
const COLOR1 = '#FFD103';
const COLOR2 = '#A303FF';
const COLOR3 = '#CCCCCC';

codingedgar

const BOARD_SIZE = 208 as const;
const BOARD_PADDING = 4 as const;
const LINE_WIDTH = 8 as const;
const LINE_CAP_SIZE = LINE_WIDTH / 2;
const CELL_SIZE = 64 as const;
const CELL_PADDING = 4 as const;
const CELL_CENTER = CELL_SIZE / 2;
const COLOR1 = '#FFD103';
const COLOR2 = '#A303FF';
const COLOR3 = '#CCCCCC';