继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

Optimizing JavaScript Code - 1

会当凌绝顶聪明
关注TA
已关注
手记 240
粉丝 36
获赞 122

There is an excellent article named
Optimizing JavaScript Code. The authors are software engineers on Gmail
and Google chrome.

I appreciate the knowledge described in this article and try to repeat it in my
own words.

Faster string concatenation

I have described this rule in my article
JavaScript Tips and Tricks - 5.

    // BAD    var longStr = "This is a very long " +        "long long " +        "long string."    // GOOD    var longStr = ["This is a very long ",        "long long ",        "long string."].join("");

Notice: the original article use join() to concat string is incorrect,
which is the same as join(”,”).

Avoid create too many temporary strings

Build up long strings by pass array into functions, to avoid create too many temporary
strings.

Remeber in my last article -
Reference and array clone, i describe how an array is passing by reference.

    // BAD    function createMenu(index) {        return "<li>Menu " + index + "</div>";    }     var arr = ["<ul>"];    for (var i = 0; i < 100; i++) {        arr.push(createMenu(i));    }    arr.push("</ul>");    var menu = arr.join("");     // GOOD    function createMenu(index, arr) {        arr.push("<li>Menu " + index + "</div>");    }     var arr = ["<ul>"];    for (var i = 0; i < 100; i++) {        createMenu(i, arr);    }    arr.push("</ul>");    var menu = arr.join("");

Define class method in prototype

    // BAD    function Person(name) {        this.name = name;        this.getName = function() {            return this.name;        };    }     // GOOD    function Person(name) {        this.name = name;    }    Person.prototype.getName = function() {        return this.name;    };

The first method is inefficient, as each time a instance of Person is constructed,
a new function and closure is created.

I also mention the prototype property in this article -
Prototype/Constructor that i have known

Don’t define reference type in prototype

I have describe this rule in my article -
Athena JavaScript Questions - 2.

You can also refer to that article to discover why we should not define reference
type in prototype.

But this google article suggest define value type variables in prototype (such as
Number, Boolean, String, null, undefined).

The purpose is to avoid unnecessarily running the initialization code each time
the constructor is called.

For example:

    // Google prefered way:    function Person(name) {        if (name) {            this.name = name;        }    }    Person.prototype.name = "Unknown";    Person.prototype.getName = function() {        return this.name;    };     var p1 = new Person();    console.log(p1.getName());  // "Unknown"     var p2 = new Person("ZhangSan");    console.log(p2.getName());  // "ZhangSan"

Notice:We don’t have to initialize the name property when the p1 is under construction.

This may speed up the initialization and save some memory storage.

But the effects is very little if the variable is not a very very long string.

Therefore, i perfer writing the previous example in this way:

    // I prefered way:    function Person(name) {        this.name = name || "Unknown";    }    Person.prototype.getName = function() {        return this.name;    };     var p1 = new Person();    console.log(p1.getName());     var p2 = new Person("ZhangSan");    console.log(p2.getName());
打开App,阅读手记
0人推荐
发表评论
随时随地看视频慕课网APP