Common tips for Javascript _ javascript skills

Source: Internet
Author: User
This article mainly introduces common tips for Javascript. Examples summarize common tips such as javascript operators, expressions, and traversal. If you need them, refer to the example below to illustrate common tips for Javascript. Share it with you for your reference. The specific analysis is as follows:

1. boolean expressions True and False

The following boolean expressions return false:

Null
Undefined
''Null String
0 digit 0

But be careful that all of the following statements can return true:

'0' string 0
[] Empty array
{} Empty object

The following is a bad code:

The Code is as follows:

While (x! = Null ){

You can directly write the following form (as long as you want x to be not a 0 or empty string, or false ):

The Code is as follows:

While (x ){

If you want to check whether the string is null or empty:

The Code is as follows:

If (y! = Null & y! = ''){

But it would be better:

The Code is as follows:

If (y ){

Note: there are still many things to be aware of, such:

Boolean ('0') = true
'0 '! = True
0! = Null
0 = []
0 = false
Boolean (null) = false
Null! = True
Null! = False
Boolean (undefined) = false
Undefined! = True
Undefined! = False
Boolean ([]) = true
[]! = True
[] = False
Boolean ({}) = true
{}! = True
{}! = False

2. condition (ternary) operator (? :)

The ternary operator is used to replace the following code:

if (val != 0) { return foo();} else { return bar();}

You can write it as follows:

The Code is as follows:

Return val? Foo (): bar ();


It is also useful when generating HTML code:

The Code is as follows:

Var html = '';

3. & and |

The binary boolean operator can be short-circuited. It is counted as the last one only when necessary.

"|" Is called the 'default' operator, because it can be like this:

function foo(opt_win) { var win; if (opt_win) {  win = opt_win; } else {  win = window; } // ...}

You can use it to simplify the above Code:

function foo(opt_win) { var win = opt_win || window; // ...}

"&" Can also be short code. For example:

if (node) { if (node.kids) {  if (node.kids[index]) {   foo(node.kids[index]);  } }}

You can use it like this:

if (node && node.kids && node.kids[index]) { foo(node.kids[index]);}

Or:

var kid = node && node.kids && node.kids[index];if (kid) { foo(kid);}

However, this is a bit Overhead:

The Code is as follows:

Node & node. kids & node. kids [index] & foo (node. kids [index]);



4. Use join () to create a string

This is usually used as follows:

function listHtml(items) { var html = ''; for (var i = 0; i < items.length; ++i) { if(i > 0) { html += ', '; } html += itemHtml(items[i]); } html +=''; return html;}

However, this process is very slow in IE. You can use the following method:

function listHtml(items) { var html = []; for (var i = 0; i < items.length; ++i) {  html[i] = itemHtml(items[i]); } return '' + html.join(', ') + '';}

You can also use an array as the string constructor, and then use myArray. convert join ('') to a string. however, since the value assignment operation is faster than the array push () operation, try to use the value assignment operation.

5. traverse the Node List

Node lists is implemented by adding a filter to the Node iterator. this indicates to obtain its attributes. For example, the time complexity of length is O (n), and O (n ^ 2) is required to traverse the entire list through length ).

var paragraphs = document.getElementsByTagName_r('p');for (var i = 0; i < paragraphs.length; i++) { doSomething(paragraphs[i]);}

It will be better to do this:

var paragraphs = document.getElementsByTagName_r('p');for (var i = 0, paragraph; paragraph = paragraphs[i]; i++) { doSomething(paragraph);}

This method applies to all collections and arrays (as long as the array does not contain the falsy value.

In the preceding example, you can use firstChild and nextSibling to traverse the child node.

var parentNode = document.getElementByIdx_x('foo');for (var child = parentNode.firstChild; child; child = child.nextSibling) { doSomething(child);}

I hope this article will help you design javascript programs.

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.