Javascript中的一些小trick

下面是收集了一些Javascript中的一些小技巧,會不定時更新,歡迎留言補充。javascript

數字0-6到「一二三四五六日」的對應

Javascript中的日期對象獲得星期時是使用getDay()方法,獲得的是0-6的數字java

要實現的方法是面試

var chineseWeek = getChineseWeek(3); // chineseWeek爲三

比較囉嗦的實現方法有switch算法

注意:如下實現都省略了空值判斷等數組

var getChineseWeek = function(n) {

    var w = '';
    switch(n) {
        case 0:
            w = '日';
            break;
        case 1:
            w = '一';
            break;
        ...
    }
    return w;
};

第二種可使用數組app

var getChineseWeek = function(n) {
    return ['日', '一', '二', '三', '四', '五', '六'][n];
};

第三種使用字符串dom

var getChineseWeek = function(n) {
    return '日一二三四五六'.charAt(n);
};

快速獲得標準的時間格式

咱們常常有這樣的需求,把當前的時間轉化爲2014-06-23 11:36:41的形式,一般的實現方式是ui

var formatNum = function(n) {
    return n > 10 ? n : '0' + n;
};

var getCurrDateTime = function() {
    var d = new Date(),
        year = d.getFullYear(),
        month = d.getMonth() + 1,
        day = d.getDate(),
        hour = d.getHours(),
        min = d.getMinutes(),
        sec = d.getSeconds();
    return year +
        '-' +
        formatNum(month) +
        '-' +
        formatNum(day) +
        ' ' +
        formatNum(hour) +
        ':' +
        formatNum(min) +
        ':' +
        formatNum(sec);
};

咱們可使用正則簡化一下prototype

var getCurrDateTime = function() {
    var d = new Date();
    var dt = d.getFullYear() +
        '-' +
        (d.getMonth() + 1) +
        '-' +
        d.getDate() +
        ' ' +
        d.getHours() +
        ':' +
        d.getMinutes() +
        ':' +
        d.getSeconds();
    return dt.replace(/([-:\s])(\d{1})(?!\d)/g, '$10$2');
};

解析:插件

/([-:\s])(\d{1})(?!\d)/這段正則的意思是,匹配前面是-或者:或者空格的而且後面不是數字的單個數字,像2014-6-12 6:7:43這裏面的紅色數字會被匹配。而後$1是指匹配到的-或者:或者空格,$2是指匹配到的單個數字,$10$2即實現了單個數字前面補0的效果。

獲得一個數組的隨機副本

要求是

var arr = [3, 6, 8, 1, 0, 10, 67, 23];
var arr2 = shuffle(arr); // arr2 => [67, 0, 10, 1, 8, 3, 6, 23]

去百度面試的時候,面試官出過這麼一個題目,由於看過underscore的源碼,因此寫出了underscore的實現方法,以下:

_.shuffle = function(obj) {
    var rand;
    var index = 0;
    var shuffled = [];
    each(obj, function(value) {
        rand = _.random(index++);
        shuffled[index - 1] = shuffled[rand];
        shuffled[rand] = value;
    });
    return shuffled;
};

原理就是得到一個隨機索引,根據隨機索引取出數組中隨機的一個,與最新的一個值進行交換。

而後面試官給出了另一種實現方式,原理也差很少

var shuffle = function(array, length) {
    var length = length || array.length,
        newArr = [],
        randomIndex,
        removed;
    array.forEach(function(elem, index) {
        randomIndex = Math.floor(Math.random() * index);
        removed = newArr.splice(randomIndex, 1, elem);
        removed.length && newArr.push(removed[0]);
    });
    return newArr.slice(0, length);
};

後來偶然發現了另一種更牛逼的實現方式

var shuffle = function(array, length) {
    var length = length || array.length;
    var array = array.slice();
    array.sort(function() {
        return Math.random() - 0.5;    
    });
    return array.slice(0, length);
};

獲取隨機碼

隨機碼是形如這樣形式的字符串be0e2bbd329b35ed,在JavaScript中有普遍的應用。
好比在編寫jQuery插件時,爲了標識每個插件實例,經常使用隨機碼來設置ID。

專業的叫法是uuid,能夠保持惟一性,具備複雜的算法,這裏僅僅介紹簡單的。

如下列舉幾種生成方法

第一種

var S4 = function() {
    return Math.floor((1 + Math.random()) * 0x10000).toString(16).substring(1);
};

// 隨機程度能夠隨着S4的調用次數而變化
var guid = function() {
    return S4() + S4() + S4() + S4();
};

第二種

原理差很少

Math.random().toString(36).substring(2);

交換值

第一種

var a = 1, b = 2;
a = [b, b = a][0];

第二種

var a = 1, b = 2;
a = [b][b = a, 0];

請自行領悟。

將一個數組插入另外一個數組的指定位置

看到這個標題,最早想到的應該是使用數組的splice方法,可是splice方法接受的參數是須要一個一個寫出來的

arrayObject.splice(index, howmany, item1,.....,itemX)

到這裏,能夠想到使用apply來改變參數的傳遞方式,最終代碼以下:

var a = [1,2,3,7,8,9];
var b = [4,5,6];
var insertIndex = 3;
a.splice.apply(a, Array.prototype.concat(insertIndex, 0, b));
相關文章
相關標籤/搜索