JS常見的小程式碼

龍恩0707發表於2013-08-27
JS

一：去掉陣列裡面的重複項。

比如 如下一個陣列：var arr = [1,2,4,3,4,3]; 我想要得到陣列 [1,2,4,3].為這樣的 寫一個函式去掉重複的項。

var unique = function(arr){
　　arr = arr || [];
　　var obj = {},
　　      newArray = [];
　　if(arr.length > 0){
　　　　for(var i = 0, len = arr.length; i < len; i+=1){
　　　　　　var curItem = arr[i],
　　　　　　　　itemTemp = typeof(curItem) + curItem;
　　　　　　if(obj[itemTemp] !== 1){
　　　　　　　　newArray.push(curItem);
　　　　　　　　obj[itemTemp] = 1;
　　　　　　  }
　　　　  }
　　  }
　　　return newArray;
};

二：返回陣列裡面的最大項：

 比如需求如下 有個陣列 var arr = [1,2,3,4,5]; 想返回陣列裡面的最大項。 我們只需要寫如下函式即可：
     var maxValue = function(arr){
         arr = arr || [];
         var i,
              tempVal = 0;
         for(i = 0, len = arr.length; i < len; i+=1){
  　　　　 var curVal = arr[i];
　　　　   if(curVal > tempVal){
              　　tempVal = curVal;
               }
          }
         return tempVal;
    };

三： 陣列裡面的項從小到大的排序問題.

有時候我們的需求要陣列裡面的數字從小到大排序問題，那麼我們常見的方法有sort這個方法 可以使數字從小到大的排序 但是
用這個sort排序有個問題就是它根據ASCLL編碼來排序的 比如陣列[1,23,5],它排序後我們期望的是[1,5,23],但是它卻返回了
[1,23,5],為什麼呢？他首先計算2的ASCLL編碼是50(因為1的ASCLL編碼是49)，5的ASCLL編碼是53，所以50小於53.這是我們不
想要的結果。那麼至於這種情況我們自己可以寫個簡單的函式來支援下：如下：

var compareNum = function(a,b){
     if(a > b){
          return 1;
      }else if(a < ｂ){
          return -1;
      }else {
         return 0;
      }

}

然後呼叫 陣列.sort(compareNum);就ok了 但是我們有個更簡單函式可以代替上面的函式：如下

陣列.sort(function(a,b){
     return a - b;
});

四：物件根據陣列排序的問題。

     有時候我們有這麼樣的一個需求 向伺服器發一個請求 帶引數 商品ID 陣列傳過去 但是後臺返回一個陣列 裡面是以物件的形式存在
時候，由於後臺開發人員懶的緣故，沒有給我們排序，而我們前端需求是向伺服器請求引數的順序傳過去 返回的後順序和傳過去一
樣的順序。

  

比如這麼一個陣列：var shopId = ['001','002','003','004']; 伺服器返回的如下：

var callId = [{
'itemId': '003'
},
{
'itemId': '004'
},
{
'itemId': '002'
},
{
'itemId': '001'
}];

但是我是想返回的順序是：

var callId = [{
'itemId': '001'
},
{
'itemId': '002'
},
{
'itemId': '003'
},
{
'itemId': '004'
}];

程式碼可以如下這樣：

var sorting = function(shopId,callId){
　　var obj = {};
      for(var i = 0, ilen = shopId.length; i < ilen; i+=1){
          obj[shopId[i]] = i;
      }
     for(var j = 0, jlen = callId.length; j < jlen; j+=1){
         var curItem = callId[j];
         curItem._id = obj[curItem.itemId];
     }
     var compareId = callId.sort(function(a,b){
         return a._id - b._id;
     });

     return compareId;
};
console.log(sorting(shopId,callId));

五： 如何獲取當前 select 元素的值。

      最近看到"懌飛" 的一篇很早的部落格關於如何獲取當前select元素的值得問題，感覺蠻好的 對以後工作也有幫助，所以打算收藏下：

  1. 如果 select 元素下的所有 option 元素均沒有指定 selected 屬性，會預設選中第一個。
  2. 可以通過 select.selectedIndex 獲取到選中的 option 元素的索引。
  3. 可以通過 select.options[select.selectedIndex] 獲取到選中的 option 元素。
  4. option 元素 <option selected="selected" value="value3">text3</option>，可以通過 option.value 獲得 option 元素的 value 屬性值，即 value3；可以通過 option.text 獲得 option 元素內的文字，即 text3。
  5. 如果 option 元素沒有定義 value 屬性，則 IE 中 option.value 無法獲得，但 Safari、Opera、FireFox 依舊可以通過 option.value 獲得，值同於 option.text 。
  6. 可以通過 option.attributes.value && option.attributes.value.specified 來判斷 option 元素是否定義了 value 屬性。
  7. 比如HTML程式碼如下：
  8. <select id="select">
         <option value="11111">11111</option>
         <option value="22222">22222</option>
         <option value="33333">33333</option>
         <option value='44444'>44444</option>
         <option value='55555'>55555</option>
         <option value='66666'>66666</option>
      </select>
  9. var getSelectValue = function(select) {
            var idx = select.selectedIndex, //獲取選中的option的索引
                option,
                value;
            if(idx > -1) {
                option = select.options[idx];  //獲取選中的option元素
                value = option.attributes.value;
                return (value && value.specified) ? option.value : option.text;
            }
            return null;
        };
        var select = document.getElementById('select');
        alert(getSelectValue(select));執行下就知道了。

相關文章