Javascript的一些奇技淫巧持续更新

js学习笔记

1.replace方法
首先字符串的replace方法并不会替换所有匹配的字符串，仅仅替换第一次，当然 JavaScript 老手们都知道这里可以使用正则表达式，并且需要加上一个全局标志位（/g）

//Mistake
var str="David is an Arsenal fan, which means David is great";
str.replace("David","Tom") //Tom is an Arsenal fan, which means David is great
//Desired
var str="David is an Arsenal fan, which means David is great";
str.replace(/David/g,"Tom") //Tom is an Arsenal fan, which means Tom is great

还有一个情况就是忽略大小写，此时标志位 /i 就很实用

str.replace(/david/gi, "Tom"); // "Tom will always be an Arsenal fan, which means Tom will always be great"
2.Array.prototype.sort 方法
它可以这样用[1,3,7,2,9].sort();  
也可以这样用
[  
        { name: "Robin Van PurseStrings", age: 30 },  
        { name: "Theo Walcott", age: 24 },  
        { name: "Bacary Sagna", age: 28  }  
    ].sort(function(obj1, obj2) {  
        // Ascending: first age less than the previous  
        // 实现增序排列：前者的 age 小于后者  
        return obj1.age - obj2.age;  
    });
 // Returns:    
    // [  
    //    { name: "Theo Walcott", age: 24 },  
    //    { name: "Bacary Sagna", age: 28  },  
    //    { name: "Robin Van PurseStrings", age: 30 }  
    // ]

不仅可以对简单类型的数组项进行排序，可以通过属性来排序对象。如果哪天服务器端发来一段 JSON 数据，而且其中的对象需要排序。
3.用 length 属性来截断数组
几乎所有开发者都踩过 JavaScript 的这个坑——“传对象只是传引用”。
经常会试图把一个数组清空，但实际上却错误地创建了一个新数组。

var myArray = yourArray = [1, 2, 3];  
// :(  
// 囧  
myArray = []; // `yourArray` is still [1, 2, 3]   
// The right way, keeping reference  
// 正确的方法是保持引用  
myArray.length = 0; // `yourArray` and `myArray` both [ ]  
                    // `yourArray` 和 `myArray`（以及其它所有对这个数组的引用）都变成 [ ] 了

坑里的人们终于明白，原来传对象只是在传引用。因此当我把 myArray 重新赋值为 [] 时，确实会创建出一个新的空数组，
但其它对老数组的引用仍然没变！大坑啊！还是换用截断的方法吧，少年。
4. 使用 push 来合并数组

var mergeTo=[4,5,6];
var mergeFrom=[7,8,9];
Array.prototype.push.apply(mergeTo,mergeFrom);
console.info(mergeTo); //[4, 5, 6, 7, 8, 9]

5.已最快的方式创建一个字符串

var arr = ['item 1', 'item 2', 'item 3'];  
        var list = '<ul><li>' + arr.join('</li><li>') + '</li></ul>'; 
        //arr.join(separator); //返回字符串，这个字符串将数组的每一个元素值连接在一起，中间用 separator 隔开。
        //return :<ul><li>item 1</li><li>item 2</li><li>item 3</li></ul>

5.降低全局冲突

    var name = 'Jeffrey';  
    var lastName = 'Way';  
      
    function doSomething() {...}  

    console.log(name); // Jeffrey -- or window.name
//Better
 var DudeNameSpace = {  
   name : 'Jeffrey',  
   lastName : 'Way',  
   doSomething : function() {...}  
 }  
console.log(DudeNameSpace.name); // Jeffrey

以一个单一的名称，你显著降低与其他应用程序，JS库冲突的机会。”

6.Use [] Instead of New Array()

//Okay

    var a = new Array();  
    a[0] = "Joe";  
    a[1] = 'Plumber';  

//Better

    var a = ['Joe','Plumber'];

7.变量的长名单？省略“VAR”关键字，并使用逗号而不是

    var someItem = 'some string';  
    var anotherItem = 'another string';  
    var oneMoreItem = 'one more string';  

//Better

    var someItem = 'some string',  
        anotherItem = 'another string',  
        oneMoreItem = 'one more string';

8.Use Firebug's "Timer" Feature to Optimize Your Code

function TimeTracker(){  
 console.time("MyTimer");  
 for(x=5000; x > 0; x--){}  
 console.timeEnd("MyTimer");  
}

9.自动执行函数

(function doSomething() {  
   return {  
      name: 'jeff',  
      lastName: 'way'  
   };  
})();

Javascript的一些奇技淫巧 持续更新

Javascript的一些奇技淫巧持续更新