Logical Assignment Operators

By  on  

I love JavaScript, it's my favorite programming language, but I love dipping into other languages because they offer a new perspective on coding paradigms. There've been syntax additions to JavaScript that I've seen I found interesting (think ?? in optional chaining) and now we get more -- logical assignment operators. Let's check out how they can be used!

||=

Or-Or-Equals is used to assign a value when one doesn't exist:

let name;
const defaultName = "Guest";

name ||= defaultName;
// name >> "Guest"

// Equivalent: name || (name = defaultName);

??=

Question-Question-Equals assigns value when the value is undefined:

const j = 1;
j??= 10
// j >> 1

x = undefined;
x ??= 10
// x >> 10

&&=

And-And-Equals assigns value to the last in line when both are defined:

let name;
const defaultName = "Guest";

name &&= defaultName;
name >> undefined

// Both have values
let name = "David";
const defaultName = "Guest";

name &&= defaultName;
// name >> "Guest"

// Equivalent: name && (name = defaultName);

I do worry, at least in the short term, that this new syntax could be hard to maintain, but just like every other new language feature, we'll get used to it!

Recent Features

  • By
    CSS Animations Between Media Queries

    CSS animations are right up there with sliced bread. CSS animations are efficient because they can be hardware accelerated, they require no JavaScript overhead, and they are composed of very little CSS code. Quite often we add CSS transforms to elements via CSS during...

  • By
    Serving Fonts from CDN

    For maximum performance, we all know we must put our assets on CDN (another domain).  Along with those assets are custom web fonts.  Unfortunately custom web fonts via CDN (or any cross-domain font request) don't work in Firefox or Internet Explorer (correctly so, by spec) though...

Incredible Demos

  • By
    MooTools 1.2 Image Protector: dwProtector

    Image protection is a hot topic on the net these days, and why shouldn't it be? If you spent two hours designing an awesome graphic, would you want it ripped of in matter of seconds? Hell no! That's why I've created an image...

  • By
    Check All/None Checkboxes Using MooTools

    There's nothing worse than having to click every checkbox in a list. Why not allow users to click one item and every checkbox becomes checked? Here's how to do just that with MooTools 1.2. The XHTML Note the image with the ucuc ID -- that...

Discussion

    Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!