Shulou(Shulou.com)06/03 Report--

This article shows you the old structure that should be avoided when realizing the excellent practice of JavaScript. The content is concise and easy to understand, which will definitely brighten your eyes. I hope you can get something through the detailed introduction of this article.

Like any other programming language, JavaScript has its own list of best practices that make programs easier to read and maintain.

Because JavaScript has many small traps, you should be careful to avoid them. You can make JavaScript code easy to read by easily following some best practices.

Avoid declaring global variables

For whatever reason, you should avoid using global variables as much as possible.

One is that they are easily overridden in different places because global variables are available everywhere. In addition, global variables are properties of the window object and can override the contents of the window object.

These two problems can make the code difficult to execute. Therefore, you should define as many local variables as possible.

You can use the var, let, or const keywords to define local variables.

Variables defined with var are available at and below the defined level before they are defined. For example, the following code:

Const log = () = > {console.log (x);} log (); var x = 1; log ()

In the code, the x in the first console.log is undefined, and the x in the second log is 1. 0.

The following is the equivalent code:

Var x; constlog= () = > {console.log (x);} log (); x = 1; log ()

Variables declared with let are only available after they are defined, so if you give the following code:

Const log = () = > {console.log (x);} log (); let x = 1; log ()

The following error message appears:

Uncaught ReferenceError: Cannotaccess'x 'before initialization

Use the const keyword to define constants that can only be assigned once and cannot be reassigned. Unlike var, this constant is available only after it has been declared.

For example, the following code:

{console.log (x);} const x = 1 * * log ()

Calling log before const x = 1 also produces the following error message:

Uncaught ReferenceError: Cannotaccess'x 'before initialization

If you want to use variables in different parts of the program, you should use the JavaScript module, and then build these modules into one or more large files when you publish the code. This method is feasible after ES6.

You can export variables and introduce them into other modules. You can also use Export default to export the entire module. In this way, only the parts that should be available outside the module can be exported, and the rest is invisible.

In addition, you can use closures to save variables in functions, which avoids external calls. The following is a simple closure to use:

= () = > {const x = 3; return () = > x * 2;}

Keeping x in the divide function avoids external calls and returns a function that handles x.

Then write the following code to call:

Console.log (divide ())

Do not pass strings to setInterval or setTimeout

Instead of passing a string to the first argument of a setInterval or setTimeout function, pass a callback function.

If you pass a string instead of a callback function, the browser will use eval to run the code in the string, which is slow and vulnerable to code injection attacks.

Therefore, there is no reason to do this unless we really need to run dynamically generated code, but this should be a very rare situation.

The following code should not be written:

SetTimeout () = > {document.getElementById ('foo'). TextContent = 'foo';}, 1000)

The following code should be written:

SetTimeout () = > {document.getElementById ('foo'). TextContent = 'foo';}, 1000)

Do not use the "with" statement

On the face of it, the with statement seems to be a good shortcut to access the deeply nested properties of an object. For example, you can write:

Let obj = {foo: {bar: {baz: 1}} obj.foo.bar.baz=2

Instead of:

Let obj = {foo: {bar: {baz: 1}} with (obj.foo.bar) {var baz = 2;}

But even this interferes with global objects and makes it unclear whether baz can be accessed outside the with statement. Because you can also declare new variables in the with statement:

Let obj = {foo: {bar: {baz: 1}} with (obj.foo.bar) {var baz = 2;}

Here the baz variable is declared inside the with statement, but cannot be called externally.

Fortunately, the with statement is not allowed in JavaScript strict mode, so you don't have to worry about it now.

Var keyword

In ES6, variables and constants can be declared using the block-scoped let and const keywords, respectively. Variables can be declared because they have a clear scope.

The scope of use of variables declared with var is vague. If declared in a block such as an if block or loop, the declared variable is available outside the block.

For example:

For (let I = 0; I

When programming with JavaScript, we want to avoid using many of the old structures that existed in earlier versions of JavaScript. Using these structures makes the code difficult to read and makes it easy to generate bug.

First of all, avoid global variable declarations to prevent accidental references and declarations of content in the global scope. This also reduces the possibility of accidentally modifying the value of a global variable.

Second, you should stop passing code in the string and instead pass the callback function to the first argument of the setTimeout and setInterval functions. Because eval will be used to run code stored in strings, this exposes the program to code injection attacks and is slow.

You should also avoid using the with statement because it creates variables within the global object.

Similarly, because the scope of variables declared by the var keyword is ambiguous, you should avoid using the var keyword to declare variables.

The above content is to pay attention to the old structures that should be avoided when implementing JavaScript good practices. Have you learned any knowledge or skills? If you want to learn more skills or enrich your knowledge reserve, you are welcome to follow the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.