Let’s look at the JavaScript statement. We will go over the simple uses, as well as a deep dive into some more advanced concepts. with Note: Use of the with statement is discouraged. It can lead to strange bugs. That said, it is important to understand how it works because it may exist in legacy code. With Function Syntax From Mozilla’s definition: (expression){
  statement
} with : An that evaluates to an object that will become the default object inside its scope. expression expression : Code that will run with the evaluated expression as the default object statement Example car = { : } (car){ .log(color)
} let color 'red' with console // prints 'red' As you can see, the car object becomes the default object in the scope. The object’s properties become available without using the ‘.’ operator. If the variable already exists in the parent scope, it will be overwritten: color = car = { : } (car){ .log(color)
} let 'blue' let color 'red' with console // prints 'red' Why Shouldn’t I Use ‘With’? Using with is not recommended, and is forbidden in ECMAScript 5 . The recommended alternative is to assign the object whose properties you want to access to a temporary variable. strict mode While using can make long pieces of code easier to read due to the removal of long accessor paths, with (car.make.model){ size = width * height * length;
}

vs size = car.make.model.width * car.make.model.height * car.make.model.length; with let let the danger or potential bugs due to ambiguity isn’t worth it. There is an argument to be made that code will be smaller and easier to send to the browser by using ‘with’ statements. While true, the gains are negligible, especially when compared to what minified code can do. By (twitter) @wagslane Previously published at https://qvault.io/2020/01/15/javascript-with-statement-explained-a-deep-dive/ Thanks For Reading Lane on Twitter: @wagslane Lane on Dev.to: wagslane Download Qvault: https://qvault.io

Mozilla

Twitter

An ELI5 Intro to Lattices in Cryptography

JavaScript Vs. Java:  Differences, Similarities and History of Creation

Learn to code on Boot.dev

Nominated for 2022 - HackerNoon Contributor of the Year - Algorithms

Nominated for 2022 - HackerNoon Contributor of the Year - Mathematics

Nominated for 2022 - HackerNoon Contributor of the Year - Cryptography

Nominated for Coding Guru of 2022

Nominated for 2022 - HackerNoon Contributor of the Year - Github

Nominated for 2022 - HackerNoon Contributor of the Year - Online Education

Nominated for 2022 - HackerNoon Contributor of the Year - Job Hunting

Nominated for Super Career Strategist of 2022

Too Long; Didn't Read

Why You Shouldn't Use "With Statement" Syntax in JavaScript

Why You Shouldn't Use "With Statement" Syntax in JavaScript

About Author

Comments

TOPICS

THIS ARTICLE WAS FEATURED IN

Related Stories

A Complete Overview of Cryptography

10 VSCode Extensions To Make Your Life Easier

10 Ways Stand Out as a Java Developer and Land that Dream Job

10 Tips For Junior Developers To Succeed in Code

10 Things Every Beginner Should Know When Learning Javascript And React

10 Reasons Why Front End Development Is a Great Career Choice

A Complete Overview of Cryptography

10 VSCode Extensions To Make Your Life Easier

10 Ways Stand Out as a Java Developer and Land that Dream Job

10 Tips For Junior Developers To Succeed in Code

10 Things Every Beginner Should Know When Learning Javascript And React

10 Reasons Why Front End Development Is a Great Career Choice

Light-Mode

Classic

Newspaper

Dark-Mode

Neon Noir

Minty

HN StartUps