Of Stack

Ten JavaScript tips per day of 1

  • 2021-06-29 10:02:17
  • OfStack

1. Do not use script self-closing Tags

The self-closing tag used in script, although legal in XHTML, does not conform to the HTML specification and cannot be properly parsed by some browsers.I used this method when introducing EXT, which prevented the script from executing correctly.

<script src="example.js"/> --> <script src="example.js"></script>

2. Place the script in < /body > Front

If the script file is placed in < head > In addition, the execution script must be downloaded before the page is displayed, which increases the user's waiting time.Stylesheet on < head > Prevent content from displaying abnormally.1 The general pattern is as follows: 


<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>Document</title>
 <link rel="stylesheet" type="text/css" href="theme.css" />
</head>
<body>
 <!-- html Code  -->
 <script src="example.js"/>
</body>
</html>

3. Use strict mode within functions

If strict mode is used outside a function, it is possible that third-party libraries and colleagues'code will not work properly, and inside a function it will only affect your own code, not others' code. 


function myfunction(){
 "use strict";
 // function code 
}

4. Do not omit the semicolon at the end of the statement

Not having a semicolon at the end of the code can cause compression errors, and in some cases can improve the performance of the code, it is important that the interpreter take no more time to guess where to insert a semicolon.A more common problem is that semicolons are sometimes inserted incorrectly, so it is not recommended to omit them.

5. Define variables using var

The var keyword is used when defining variables, all ahead of time to the start of the function.
The benefit of this is to avoid creating global variables unintentionally and to make your code easier to understand. 


function myfunction(){
 var result = 10 + value;
 var value = 10;
 return result;
}

This function is grammatically OK, but it is not very intuitive and does not conform to human logic. It would be better to modify it as follows: 


 funciton myfunction(){
  var result;
  var value;
  result = 10 + value;
  value = 10;
  return result;
 }

Explain that 1, the above two codes are equivalent. The value of result is NAN.JavaScript, which elevates all variable declarations within a function to the beginning of the function. Code 1 becomes code 2 when the code executes, and when it runs to result = 10 + value;When value is undefined, 10 is added to NAN, and value is assigned 10.

The problem with global variables must also be clear, or the concept of namespace will not appear.

6. Functions are declared before they are used

Like variable declaration 1, function declarations are advanced by the JavaScript engine, so calls to functions can occur before function declarations in code.It is also worth noting that function declarations should not appear in statement blocks, such as: 


if (condition) {
 function myfunction(){
  alert("true");
 }
}else{
 function myfunction(){
  alert("false");
 }
}
myfunction();

Running the code we found that the output would be browser-related, true under Chrome 51 and Firefox 46 and false under IE 10.So try to avoid declaring functions in statement blocks.

7. Judgment with caution typeof underfined null

null is a special value that we often confuse with undefined. The following scenarios should use null:

Used to initialize a variable that may be assigned to an object. Used to compare with an initialized variable. When the parameters of a function expect an incoming object, they are passed in as parameters. Outgoing as a return value when the return value of a function is expected to be an object.

The following situations should not use null:

Do not use null to check if a parameter has been passed in. Do not use null to check if a variable is initialized.

The best way to understand null is to use it as a placeholder for objects.The reason we often confuse null with undefined is that we think null and undefined are variables uninitialized, but only undefin represents a variable that has not been initialized and null represents an object.See the following code: 


var person;
console.log(typeof person);  //undefined
console.log(typeof foo);   //undefined
var house = null;
console.log(typeof house);  //object

So try not to use typeof to determine whether a variable is initialized, you are not sure if the variable does not exist or is not initialized, and returning null is not sure if the variable is properly assigned, so be careful with typeof.

8. Be careful with the Number type

You also know that JavaScript integers support literal values in decimal, octal, and 106 digits.If the literal value exceeds the range in octal, then leading zeros will be ignored and subsequent values will be interpreted as decimal.

console.log(012);    //10
console.lgo(082);    //82

Grammatical errors occur when decimal digits are used in decimal digits.Another point is that octal literals are not valid in strict mode.It is also clear that floating-point calculations based on the IEEE754 value are always the same, so you should never test a specific floating-point value.
There is a special value in the numeric type, NaN (Not a Number), which is used to indicate that a numeric value should have been returned but not a numeric type.NaN and any values are not equal, including NaN itself.We can test it with the isNaN() function.

9. Dynamic assignment using logical operations

What you like better 


var person={
  age:10
}
var condition;
var myVar = condition && person;
alert(myVar)

If condition is converted to boolean of type false, myVar = condition, and myVar = person if true. 


var person={
    age:10
  }
var condition;
var myVar = condition || person;
  alert(myVar)

If condition is converted to boolean, myVar = condition, and myVar = person if false.

10. Do not use the with statement

One important reason for not using with is that the syntax itself disables the with statement in strict mode, which also indicates that the ECMAScript Committee is certain that with should not be used.Let's look at the following examples: 


var book = {
 title : "Maintainable JavaScript",
 author: "Nicholas C. Zakas"
};
var message = "The book is ";
with(book) {
 message += title;
 message += "by " + author;
}

The problem with the above code is that it is difficult to distinguish where title and author appear, whether message goes to address 1 local variable or an attribute of book, and that the JavaScript engine and compression tools cannot optimize this code because they cannot guess the correct meaning of the code.

Okay, 10 already. Let's see you next 10.

Related articles: