JavaScript Learning Summary JS loading skills (a) by Fungleo

JavaScript Learning Summary JS loading skills (a) by Fungleo preface

I've been working on JavaScript lately. But I have a low level of javascript, so it's difficult to learn. And recently came into contact with a lot of knowledge points. Good memory is not as bad as writing, so write this piece of fragmented blog, remember I learned some fun things.

Simple new types of elements

Creating a variety of elements has a corresponding method, for example, creating an array can be written like this, of var arr = new Array course, this is true, but my English sucks and I don't like the code. I like the following.

// 创建一个数组var arr = [];// 创建一个对象var obj = {};// 创建一个空字符串var"";

Do not remember an English word, do it.

Converts a non-Boolean value to a Boolean value with an exclamation mark

var"abc";console.log(!str);

Output

false

An exclamation point can turn everything into a Boolean value, as shown in:

This makes it useful for us to make some data judgments, and the code is very short. Of course, you have to understand what these will translate into.
Of course, if you need to convert the content to the opposite, use two exclamation marks.

var"abc";console.log(!!str);

Output

true

The magical use of double wave numbers (converting content to numbers, or fractional rounding)

This is the most recently seen in a classic code in the knowledge learned. This is very suitable for loading. In fact, it will be very useful in use.

var"123.123";console.log(~~str);

Output

123

As you can see above, you can convert a string to a number using a double tilde, and take an integer.

Its various magical activities are as follows:

As shown, the tilde can convert everything to a number, 0 or-1.

It is important to note that the rounding of the double wave is directly minus the decimal point, rather than the five-in calculation of the four provinces used.

Solve the cross-domain problem of jquery ajax calling remote interface

First, the interface must allow remote invocation. This is a back-end or Ops thing. You have to make sure that one of the interfaces you get is allowed to be called remotely. Otherwise, there is nothing.

Okay, let's see how we can fix this.

$.ajax({    type:‘get‘,    url:url,    // 下面的两行代码,就是解决跨域的关键    true},    true,    // 就是上面的两行代码    function(data){        // do something    },    function(data){        // do something    }});

Works well for GET or post!

Don't ask me why, I will only use ~

Creating JSON data with jquery

First of all, I think of the method is actually a string splicing. After being seen and laughed at, say you are really stupid.
Hey, no way, who call me base poor. After some advice, finally know how to create JSON data is the most convenient.

The first step is to create an object.
In the second part, write the value inside the object.
The third step is to convert the object into JSON data.

How to do it, see!

The key code is as follows:

var obj = {};JSON.stringify(obj);

String interception

This is more commonly used. But I need to find the word from the search engine every time. substring(0,1)

var"abcdefg";str.substring(str.length-1,str.length);

As in the above code, the last character will be intercepted.

The interception of strings is needed in many places, such as the interception of URLs. Use a variety of combinations, flexible use, can be used better.

Number retains n digits after decimal point

This is a more common requirement. For example, we are calculating a numeric value, which is obviously a very long decimal number. Then we have to keep a few decimals in use and then use.

How to do it? Here's what I do:

var103;~~(num*10000)/10000;

Return

3.3333

Here, the method of four provinces and five is not used. If you need four provinces and five in, you will be ~~ replaced Math.round .

Create a random integer

For example, we need to create a random integer within 0-100.

var randNum = ~~(Math.random()*100);

In this way, we create a random number.

To manipulate the DOM structure as little as possible

For example, we may often do is the three-level linkage of the provincial and Municipal code. And the drop-down menu obviously requires us to manipulate the DOM structure.

The following is a bad demonstration.

var $obj = $("#obj");var data = [{"id":0,"name":"a"},{"id":1,"name":"b"}];for (var0; i < data.length; i++) {    $obj.append(‘<option value="‘+data[i].id+‘">‘+data[i].name+‘</option>‘);};

As above, there is one piece of data that you need to manipulate the DOM once, which is a waste of resources. Although the problem was solved. But I don't recommend it. The same functionality, which I will implement:

var  $obj = $ ( Span class= "hljs-string" > "#obj" ); var  data = [{ "id" : 0 ,  "name" :  "a" },{  "id" : 1 ,  "name" :  "B" }]; var  tempstr = ; for  (var  i = 0 ; i < data.length; i++) {TempStr + = ( ' <option value= "'  +data[i].id+" > "  +data[i].name+);}; $obj. HTML (TEMPSTR);  

As above, put all the results into a temporary string. Finally, the result is inserted into the DOM once, so that only one time the DOM structure is executed. Performance will be greatly improved.

Summary

1. Name must be standardized, do not try to use other people can not understand the name. Sometimes, a good name is better than everything.
2. If the logic is complex, try to disassemble the complex logic into one small logic, which will better solve the problem and troubleshoot the problem.
3. The most stupid way to achieve the effect, and then consider the optimization of the code. When you think about it from the beginning, you find it difficult to solve the problem, especially for beginners like me.
4. Be sure to write a comment!!!!
5. Be patient, have a problem, smoke a cigarette and think about it.
6. Unless it is difficult, and the results are very certain, and the search engine can not solve. Don't ask people in the group.
7. It is a waste of time to discuss concepts in a group.

This article is original by Fungleo, allow reprint. But reprint must be signed by the author, and keep the article starting link. Otherwise, legal liability will be investigated.
Starting Address: http://blog.csdn.net/FungLeo/article/details/51378593

JavaScript Learning Summary JS loading skills (a) by Fungleo