首頁 > web前端 > js教程 > 神奇的rotate函數

神奇的rotate函數

黄舟
發布: 2017-02-15 14:21:11
原創
3031 人瀏覽過

我要跟大家介紹一種神奇的rotate或者說數組翻轉函數,先來看一個例子:


var data = [1, 2, 3, 4, 5];

rotate(data, 1) // => [5, 1, 2, 3, 4]
rotate(data, 2) // => [4, 5, 1, 2, 3]
rotate(data, 3) // => [3, 4, 5, 1, 2]
rotate(data, 4) // => [2, 3, 4, 5, 1]
rotate(data, 5) // => [1, 2, 3, 4, 5]
登入後複製

看出了門道沒?沒看出沒關係,我來說明下。

拿第一個rotate(data,1)來說,相當於第一個到倒數第二的所有元素整體往右邊移了一位,而倒數第一的元素劃了個半月弧,跑到了第一名的位置。

rotate(data,2)rotate(data,1)的基礎上,執行了相同的操作。

rotate(data,3)rotate(data,2)的基礎上.....

這還沒完,rotate函數還有更強的功能,試著傳入個負數,會咋樣?


rotate(data, -1) // => [2, 3, 4, 5, 1]
rotate(data, -2) // => [3, 4, 5, 1, 2]
rotate(data, -3) // => [4, 5, 1, 2, 3]
rotate(data, -4) // => [5, 1, 2, 3, 4]
rotate(data, -5) // => [1, 2, 3, 4, 5]
登入後複製


細心的你大概很快就發現了,這是和rotate正數相反的過程。

那如果傳入個0,會有什麼反應?


rotate(data, 0) // => [1, 2, 3, 4, 5]
登入後複製

翻轉0次,不就是什麼都不做嘛,汗^_^

這個函數幾乎無所不能:

數字數組可以,其它對象數組也可以翻轉。


rotate(['a', 'b', 'c'], 1)     // => ['c', 'a', 'b']
rotate([1.0, 2.0, 3.0], 1)     // => [3.0, 1.0, 2.0]
rotate([true, true, false], 1) // => [false, true, true]
登入後複製

想翻轉多少次都沒問題!哪怕來個上萬次!


var data = [1, 2, 3, 4, 5]

rotate(data, 7)     // => [4, 5, 1, 2, 3]
rotate(data, 11)    // => [5, 1, 2, 3, 4]
rotate(data, 12478) // => [3, 4, 5, 1, 2]
登入後複製

好了,看了它這麼多神奇的特性,咋們來想想該怎麼實現它。
既然是分正數,負數和零三種基本情況,那就來個各個擊破吧!

對正數,就專門寫這個函數:


if(typeof Array.prototype.shiftRight !== "function"){
    Array.prototype.shiftRight = function(n){
      while(n--){
        this.unshift(this.pop());
      }
    };
}
登入後複製

那麼,負數就靠這個功能相反的函數了:


if(typeof Array.prototype.shiftLeft !== "function"){
    Array.prototype.shiftLeft = function(n){
      while(n--){
        this.push(this.shift());
      }
    };
}
登入後複製

出來了:

function rotate(array,n){
    //copy array
    array = array.slice(0);
    if(n > 0){
        array.shiftRight(n);
    }
    else if(n < 0){
        array.shiftLeft(-n);
    }
    return array;
}
登入後複製

以上就是神奇的rotate函數 的內容,更多相關內容請關注PHP中文網(www.php.cn)!




來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板