Seven precautions for learning JavaScript: [mandatory ].
Knowledge description:
For beginners of JavaScript, pay attention to the following seven major details to make our code easier to understand and more efficient when the same function is implemented.
I. Simplified code
Example: Create an object
Previously, this was the case:
Var car = new object ();
Car. color = "red ";
Car. wheels = 4;
Car. age = 8;
But now we can write it like this:
Var car = {color: 'red', wheels: 4, age: 8}
Example: Create an array
Previously, this was the case:
Var studentArray = new Array ('hangsan', 'lisi', 'zhaowu', 'wuliu ');
But now we can write it like this:
Var studentArray = {'zhangsan', 'lisi', 'zhaowu', 'wuliu '};
For example, use a ternary operator to simplify code
The preceding statement is as follows:
Var result;if(x > 100){ Result = 1;}else{ Result = -1;}
Now you can write it as follows:
Var result = x> 100? 1:-1;
Ii. Use JSON as the data format
Use Json format to store data:
var band = { "name":"The Red Hot Chili Peppers", "members":[ { "name":"Anthony Kiedis", "role":"lead vocals" }, { "name":"Michael 'Flea' Balzary", "role":"bass guitar, trumpet, backing vocals" }, { "name":"Chad Smith", "role":"drums,percussion" }, { "name":"John Frusciante", "role":"Lead Guitar" } ], "year":"2009"}
You can also use JS to store data. The Code is as follows:
<div id = “dataDiv”></div><script> Function saveData(data){ Var out =“<ul>”; For(var i=0; i<data.length; i++){ Out += “<li><a href =”'+data[i].url+'”>+data[i].d+</a></li>”;}Out += ‘</ul>';Document.getElementById(‘dataDiv').innerHTML = out;}</script>
You can even use the stored data generated by JS as the API return value.
<Script src = "http://feeds.delicious.com/v2/json/codepo8/javascript? Count = 15 & callback = delicious ">
</Script>
Iii. use JavaScript native functions whenever possible
For example, obtain the maximum value in a group of data.
Var maxData = Math. max (0, 20, 50, 10 );
Alert (maxData); // The maximum returned value is 50.
For example, if you use JS to add a class style to an element, the code snippet is as follows:
Function addClass(elm, newclass){ Var classes = elm.className.split(‘ ‘ ); Classes.push(newclass); Elm.className = classes.join(‘ ');}
Iv. Event Delegation
For example:
Best script writing method:
(function(){ var resources = document.getElementById('resources'); resources.addEventListener('click',handler,false); function handler(e){ var x = e.target; // get the link tha if(x.nodeName.toLowerCase() === 'a'){ alert('Event delegation:' + x); e.preventDefault(); } };})();
5. Anonymous Functions
var myApplication = function(){ var name = 'Chris'; var age = '34'; var status = 'single'; function createMember(){ // [...] } function getMemberDetails(){ // [...] } return{ create:createMember, get:getMemberDetails }}();//myApplication.get() and myApplication.create() now work.
6. configurable code
You can configure the Code to make it easier for others to use or modify. The solution is to add a configuration object to the script you write. Key points are as follows:
1. Add an object named configuration in your script.
2. store all the things that others may want to change in the configuration object, such as css id, class name, and language.
3. Return this object as a public attribute so that others can rewrite it.
VII. Code compatibility
Compatibility is easy for beginners to ignore. Generally, Javascript is tested in a fixed browser, and this browser is probably IE, which is very fatal, this is because IE currently has the worst standard support among several mainstream browsers. The end user may see that the code you write cannot run correctly in a browser. You should test your code in mainstream browsers. This may be time-consuming, but it should be done.
The above seven major considerations for JavaScript learning [note] are all the content shared by the editor. I hope you can give us a reference and support the house of helping customers.