Javascript Best Practices Code safe, Code fast
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Javascript Best Practices
Code safe, Code fast
if (type == ‘student’) { access = true; } else { access = false; }
Ordinary Javascript Code
if (isTrue == true) { doRightThing(); } else { cleanYourMess(); }
Function call Using Ternary Operator
(access == ‘student’) ? alert(“he’s student”) : alert(“outsider”);
(access == ‘student’) ? ( count++, alert(‘hi’)) : ( noAccess(), alert(‘no’));
Multiple Expression
Using Ternary Operator
access = (type == ‘student’) ? true : false;
Using Logical Operator in assignment
function(num) { num = num || “default”; }
Using OR
function(num) { if(num == undefined) { num = “default”; } }
default argument
function(status) { if (status ==true) { status =false; } else { status = true; } }
Switch on / Switch off
Using NOT
function(status) { status = !status; }
var user = [ name : "Arkar", children: [ "Hla Hla","Mya Mya","Aung Aung","Tun Tun”], wife : "Phyo Phyo", parents: ["U U ", "Daw Daw"] getParent:function(){ return this.parent; }, getwife:function(){ return this.wife; } ];
Sample Object
for (var i=0; i<user.children.length; i++) { console.log(user.children[i]); }
loop for children
for (var i=0; i<user.children.length; i++) { console.log(user.children[i]); }
inside Loop- access user object - access children property - access length property - access user object - access children property - access children of i - execute console.log
Total result is 1 + 7 x 4 = 29
var children = user.children; for (var i=0; i<children.length; i++) { console.log(children[i]); }
- access user object - access children property - assign children
Outside Loop inside Loop
- access children - access length; - access children; - access i of children - console.log
Total result is 1 + 3 + 5 * 4 = 24
Before Optimisation After Optimisation
4
Count
29 24
10
(7x+1) (5x+4)
71 54
100 701 504
1000 7001 5004
var children = user.children; var length = children.length; for (var i=0; i<length; i++) { console.log(children[i]); }
- access user object - access children property - assign children - access children - access length - assign length
Outside Loop inside Loop
- access length - access children; - access i of children - console.log
Total result is 1 + 6 + 4* 4 = 23
Case A Case B
4
Count
29 24
10
(7x+1) (5x+4)
71 54
100 701 504
1000 7001 5004
23
(4x+7)
47
407
4007
Case C
Case A
Case B
Case C
Comparison Operator
‘4’ == 4 //true
true == 1 //true
== ===
‘4’ === 4 //false
true === 1 //false
false == 0 //true false === 0 //false
“/n /t /n” == 0 //true “/n /t /n” === 0 //false
Avoid with
with(user){ var wife = getwife(); // Phyo Phyo console.log(children); //"Hla Hla","Mya Mya","Aung Aung","Tun Tun” console.log(parent); // “U U”, “Daw Daw” }
with(user){ var getNewWife = function() { this.wife = “Zune Thinzar”; }; };
If He want new wife
// Global Scope
var getNewWife = function() { this.wife = “Zune Thinzar”; };
But end up as Global Scope
Unlucky Arkar, Sorry to hear that
So, don’t try to cheat on “with”
Javascript Number
Use toFixed()
Script.jsvar list = user.getwife();
function getChildren(user) { var list = user.children; list.forEach(function(child){ console.log(child); }); }
Script2.js
<html> <head> <script src=“script.js”> <script src=“script2.js”>
HTML
Namespace
var script1 = { list: user.getwife(), doChore : function() { for (var i of this.list) { console.log(this.list[i] + “cleaning”); } }. deleteWife: function () { delete this.list; }
var script2 = { list: user.children; getChildren: function(user) { this.list.forEach(function(child){ console.log(child); }); }, cleanChildren:function(){ /// }
Script.js Script2.js
The End
- slideshare.net/nainglinaung91 - linkedin.com/in/nainglinaung - https://twitter.com/kelvinm0rRis - https://github.com/nainglinaung
Naing Lin Aung is currently work as Programmer in Aceplus Solution. If you want to contact, you can check with the following links
Related Documents
