Learn the seven important notes of JavaScript "must see" _ Basic knowledge

Knowledge Description:

Beginner JavaScript, note the following seven big details, in the implementation of the same function, let our code more understandable, more efficient.

First, simplify the code

For example: Create an Object

This is the case before:

Var car = new Object ();

Car.color = "Red";

Car.wheels = 4;

Car.age = 8;

And now it can be written like this:

Var car = {color: ' Red ', Wheels:4, Age:8}

For example: Creating an array

This is the case before:

Var Studentarray = new Array (' Zhangsan ', ' Lisi ', ' Zhaowu ', ' Wuliu ');

And now it can be written like this:

Var Studentarray = {' Zhangsan ', ' Lisi ', ' Zhaowu ', ' Wuliu '};

For example: using the ternary operator to simplify code

The previous wording was:

Var result;

if (x > MB)

{result

    = 1;

} else{result

    =-1;

}

And now you can write:

Var result = x >100? 1:-1;

Ii. using JSON as the data format

To store data using the JSON format:

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

   ": "Leads Guitar"

  }

 ], "Year

 ": "2009"

}

You can also use JS to store data, 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>

The return value of the API that can be used to store data from the above JS

<script src= "Http://feeds.delicious.com/v2/json/codepo8/javascript?count=15&callback=delicious" >

</script>

Third, try to use JavaScript native function

For example, to get the maximum value in a set of data

var maxdata = Math.max (0,20,50,10);

alert (maxdata); The maximum value returned is 50

For example: 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. Commission of events

For example:

Best way to write script:

(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 ();

  }

 ;

}) ();

Five, anonymous function

var myapplication = function () {

 var name = ' Chris ';

 var age = '% ';

 var status = ' single ';

 function Createmember () {

  //[...]

 }

 function Getmemberdetails () {

  //[...]

 }

 return{

  create:createmember, Get:getmemberdetails

 }

} ();

Myapplication.get () and myapplication.create () now work.

Six, code can be configured

The code you write needs to be configurable if you want to make it easier for others to use or modify, and the solution is to add a configuration object to the script you're writing. The main points are as follows:

1. Add a new object called configuration in your script.

2, in the configuration object to store all other people may want to change things, such as the CSS ID, class name, language and so on.

3, return this object as a public property so that others can rewrite it.

Seven, code compatibility

Compatibility is a beginner's easy to ignore part, usually when learning JavaScript is in a fixed browser to test, and this browser is probably IE, this is very fatal, because the current several major browsers, ie to the standard of the support is the worst. What the end user sees may be that the code you write is not working correctly in a browser. You should test your code in a mainstream browser, which may be time-consuming, but it should be done.

The above study of the seven major JavaScript notes "must see" is a small series to share all the content, hope to give you a reference, but also hope that we support the cloud-dwelling community.