12 traps to be bypassed in JavaScript syntax

Source: Internet
Author: User
Tags bitwise operators

This article is excerpted from Ruan Yifeng's network log http://www.ruanyifeng.com/blog/. the original article contains 12 unsuitable javascriptsyntax. The original Article is Ruan Yifeng's post-reading experience on the book "The essence of Javascript language. The author of this book is Douglas Crockford, one of the world's most proficient Javascript and creator of the Json format. He thinks Javascript has many bad habits. It took only three months for Brendan Eich to design the language in 1995. Many language features were pushed to the market without careful consideration. As a result, when people are aware of these problems, 1 million of programmers are using it, and it is impossible to significantly modify the language itself. So Douglas Crockford decided to tell everyone which parts of Javascript are the essence, which parts are the dregs and the chicken ribs. Ruan Yifeng posted 12 types of JavaScript syntaxes to be avoided in the appendix in the book as follows:

1. =

Javascript has two equal operators: = and! =, The other group is = and! =. The former compares only equal values, and the latter compares whether the types are the same in addition to values.

Please try not to use the previous group, always use = and! =. Because = is converted by default, the rules are hard to remember. If you do not believe this, answer the following five values of the limit formula: true or false:

 
 
  1. false == 'false' 
  2.  
  3. false == undefined  
  4.  
  5. false == null 
  6.  
  7. null == undefined  
  8.  
  9. 0 == '' 
  10.  

The first three values are false, and the last two values are true.

2.

With is designed to reduce keyboard input. For example

 
 
  1. obj.a = obj.b;  
  2.  
  3. obj.c = obj.d;  
  4.  

Can be abbreviated

 
 
  1. with(obj) {  
  2. a = b;  
  3. c = d;  
  4. }  
  5.  

However, during actual operation, the interpreter first checks whether obj. B and obj. d exist. If not, then checks whether global variables B and d exist. This leads to low efficiency and may lead to accidents. Therefore, it is best not to use the with statement.

3. eval

Eval is used to directly execute a string. This statement should not be used because it has performance and security issues and makes the code more difficult to read.

What eval can do without it. For example

 
 
  1. eval("myValue = myObject." + myKey + ";");  
  2.  

Can be directly written

 
 
  1. myValue = myObject[myKey];  
  2.  

The json string returned by the ajax operation can be run using the parser json_parse.js provided on the official website.

4. continue

The purpose of this command is to return to the loop header, but the loop will return to the header. Therefore, you can avoid using this command through proper construction to Improve the efficiency.

5. switch

The case statement in the switch structure is executed sequentially by default, unless break, return, and throw are encountered. Some programmers like to use this feature, such

 
 
  1. switch(n) {  
  2. case 1:  
  3. case 2:  
  4. break;  
  5. }  
  6.  

In this way, writing is prone to errors and hard to be found. Therefore, it is recommended that the switch should be avoided. break should be added wherever case exists.

 
 
  1. switch(n) {  
  2. case 1:  
  3. break;  
  4. case 2:  
  5. break;  
  6. }  
  7.  

6. Block Structure of a single row

If, while, do, and for are both block structure statements, but can also accept single-line commands. For example

 
 
  1. if (ok) t = true;  
  2.  

Even write

 
 
  1. if (ok)  
  2. t = true;  
  3.  

This is not conducive to reading the code, and may cause errors when you add statements in the future. We recommend that you add braces regardless of whether there is only one command line.

 
 
  1. if (ok){  
  2. t = true;  
  3. }  
  4.  

7. ++ and --

Incrementing operator ++ and decimal operator -- directly from the C language, can make the code very compact on the surface, but it will actually make the Code look more complex and obscure. Therefore, for the sake of code purity and ease of coding, it is better not to use it.

8. bitwise operators

Javascript fully applies Java bitwise operators, including bitwise AND &, bitwise OR |, bitwise XOR or ^, and bitwise non ~ , Left shift <, right shift with a symbol> and right shift with 0 complement>.

This operator is intended for integers, so it is useless to Javascript because all numbers in Javascript are saved as double-precision floating-point numbers. If they are used, Javascript has to convert the number to an integer before performing the operation, which reduces the speed. In addition, "bitwise AND operator" is the same as "logic and operator" and is easy to confuse.

9. function statement

Defining a function in Javascript can be written in two ways:

 
 
  1. function foo() { }  
  2.  

And

 
 
  1. var foo = function () { }  
  2.  

The two statements are equivalent. However, during parsing, the previous write method will be automatically promoted to the Code header by the parser, which violates the requirements that the function should be defined first and then used. Therefore, when defining a function, we recommend that you, all adopt the latter method.

10. Packaging objects of the basic data type

The basic data types of Javascript include strings, numbers, and Boolean values. They all have corresponding packaging objects: String, Number, and Boolean. Therefore, some people will define related values as follows:

 
 
  1. new String("Hello World");  
  2.  
  3. new Number(2000);  
  4.  
  5. new Boolean(false);  
  6.  

  • Details about the functions of the checkbox tree in Javascript
  • Vs JavaScript HTML5 script API Preview
  • 13 Javascript and CSS menus are recommended
  • Exploring Google's JavaScript development tool Closure
  • JavaScript will add local operation APIs for direct operation
This writing is completely unnecessary and confusing, so it is not recommended to use it.

In addition, it is not recommended to use new Object and new Array. You can use {} and [] instead.

11. new statement

Javascript is the first language widely used in the world to support Lambda functions. It is essentially a functional programming language similar to Lisp. However, more than 90% of programmers in the world use object-oriented programming. In order to stay close to the mainstream, Javascript compromised and adopted the concept of classes, allowing objects to be generated based on classes.

The class is defined as follows:

 
 
  1. var Cat = function (name) {  
  2. this.name = name;  
  3. this.saying = 'meow' ;  
  4. }  
  5.  

Then, generate an object

 
 
  1. var myCat = new Cat('mimi');  
  2.  

This syntax for generating classes by using functions and generating objects by using new is actually very strange and not intuitive at all. In addition, when using it, it is easy to forget to add new, it will become the execution function, and then inexplicably several more global variables. Therefore, we recommend that you do not create an object like this, but use a work und.

Douglas Crockford provides a function:

 
 
  1. Object.beget = function (o) {  
  2. var F = function (o) {};  
  3. F.prototype = o ;  
  4. return new F;  
  5. };  
  6.  

When creating an object, you can use this function to operate the prototype object:

 
 
  1. var Cat = {  
  2. name:'',  
  3. saying:'meow' 
  4. };  
  5.  
  6. var myCat = Object.beget(Cat);  
  7.  

After an object is generated, you can assign values to relevant attributes:

 
 
  1. myCat.name = 'mimi';  
  2.  

12. void

In most languages, void is a type that indicates no value. However, in Javascript, void is an operator that accepts an operation number and returns undefined.

 
 
  1. void 0; // undefined  
  2.  

This command is useless and confusing. We recommend that you avoid using it.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.