這里總結(jié)了一些前端常見(jiàn)的算法。

**1、排序問(wèn)題**

**1.1冒泡排序**

該算法就是依次比較大小，小的的大的進(jìn)行位置上的交換。

```js
var ex=[8,95,34,21,53,12];
 function sortarr(arr){
  for(i=0;i<arr.length-1;i++){
   for(j=0;j<arr.length-1-i;j++){
    if(arr[j]>arr[j+1]){
     var temp=arr[j];
     arr[j]=arr[j+1];
     arr[j+1]=temp;
    }
   }
  }
  return arr;
 }
 sortarr(ex);
 console.log(ex);
//當(dāng)i=0的時(shí)候，里面的循環(huán)完整執(zhí)行，從j=0執(zhí)行到j(luò)=6,這也就是第一遍排序，結(jié)果是將最大的數(shù)排到了最后，這一遍循環(huán)結(jié)束后的結(jié)果應(yīng)該是[8,34,21,53,12,95]
//當(dāng)i=1的時(shí)候，里面的循環(huán)再次完整執(zhí)行，由于最大的數(shù)已經(jīng)在最后了，沒(méi)有必要去比較數(shù)組的最后兩項(xiàng)，這也是j<arr.length-1-i的巧妙之處，結(jié)果是[8,34,21,12,53,95]
//說(shuō)到這里，規(guī)律就清楚了，每次將剩下數(shù)組里面最大的一個(gè)數(shù)排到最后面，當(dāng)?shù)谝粋€(gè)循環(huán)執(zhí)行到最后的時(shí)候，也就是i=6,此時(shí)，j=0,只需要比較數(shù)組的第一和第二項(xiàng)，比較完畢，返回。
```

**1.2快速排序**

```js
//快速排序
var example=[1,4,3,8,9,6,2]
   
function quickSort(arr){
  if(arr.length<=1){
    return arr;
  }
  var left=[],right=[],current=arr.splice(0,1);
  for(let i=0;i<arr.length;i++){
    if(arr[i]<current){
      left.push(arr[i])
    }else{
      right.push(arr[i])
    }
  }
  return quickSort(left).concat(current,quickSort(right));
}
console.log(quickSort(example)); //[1, 2, 3, 4, 6, 8, 9]

//2.
function quickSort(arr,l,r){
    if(l < r){
        var i = l, j = r, x = arr[i];
        while(i<j){
            while(i<j && arr[j]>x)
                j--;
           
            if(i<j)
                //這里用i++，被換過(guò)來(lái)的必然比x小，賦值后直接讓i自加，不用再比較，可以提高效率
                arr[i++] = arr[j];
           
            while(i<j && arr[i]<x)
                i++;
           
            if(i<j)
                //這里用j--，被換過(guò)來(lái)的必然比x大，賦值后直接讓j自減，不用再比較，可以提高效率
                arr[j--] = arr[i];
        }
        arr[i] = x;
       
        quickSort(arr, l, i-1);
        quickSort(arr, i+1, r);
    }
}
```

**1.3二路歸并**

將兩個(gè)按值有序序列合并成一個(gè)按值有序序列，則稱之為二路歸并排序

```js
function marge(left,right){
  var result=[];
  il=0;
  ir=0;
  while(il<left.length && ir<right.length){
    if(left[il]<right[ir]){
      result.push(left[il++]);
    }else{
      result.push(right[ir++]);
    }
  }
  while(left[il]){
    result.push(left[il++]);
  }
  while(right[ir]){
    result.push(right[ir++]);
  }
  return result;
}
```

**2、二分查找**

是在有序數(shù)組中用的比較頻繁的一種算法，優(yōu)點(diǎn)是比較次數(shù)少，查找速度快、平均性能好；缺點(diǎn)是要求待查表為有序，且插入刪除困難

```js
// 非遞歸實(shí)現(xiàn)
function binary_search(arr, key) {
    var low = 0,
        high = arr.length - 1;
    while(low <= high){
        var mid = parseInt((high + low) / 2);
        if(key == arr[mid]){
            return  mid;
        }else if(key > arr[mid]){
            low = mid + 1;
        }else if(key < arr[mid]){
            high = mid -1;
        }
    }
    return -1;
};
//遞歸實(shí)現(xiàn)
function binary_search2(arr, low, high, key) {
    if(low > high)
        return -1;
    var mid = parseInt((low + high)/2);
    if(key == arr[mid])
        return mid;
    else if(key > arr[mid])
        return binary_search2(arr, mid+1, high, key);
    else if(key < arr[mid])
        return binary_search2(arr, low, mid-1, key);
}
```

**算法在前端的地位**

算法簡(jiǎn)單來(lái)說(shuō)，是一門研究計(jì)算機(jī)性能和資源分配的學(xué)科。前端或者說(shuō)JS在算計(jì)方面表現(xiàn)得并不優(yōu)秀，在講為什么要學(xué)習(xí)它之前，我想先說(shuō)說(shuō)在前端領(lǐng)域什么比算法效率更加重要。

比如：

1.安全。web安全在前端已經(jīng)占有一定比重，尤其是支付領(lǐng)域等。最常見(jiàn)的就是登錄驗(yàn)證碼。

2.用戶體驗(yàn)。面向用戶的東西必須用戶體驗(yàn)優(yōu)先。算法和用戶體驗(yàn)也有關(guān)聯(lián)，但通過(guò)算法在前端大幅度提高性能導(dǎo)致提高用戶體驗(yàn)，是非常少的。

3.模塊化和可拓展性。前端需要改代碼的情況往往是比較多的，誰(shuí)都不希望我要修改添加代碼的時(shí)候會(huì)產(chǎn)生連鎖反應(yīng)，我明明要改的只是一個(gè)功能一個(gè)函數(shù)，卻不得不因此改十幾個(gè)函數(shù)，這多悲催。

4.語(yǔ)義化和可維護(hù)性。代碼的可讀性也非常重要，程序員很大一部分的時(shí)間都是在查修bug，要是隨手寫(xiě)一坨自己回過(guò)頭都看不懂代碼，那多尷尬。

**- End -**

更多關(guān)于“web前端培訓(xùn)”的問(wèn)題，歡迎咨詢千鋒教育在線名師。千鋒已有十余年的培訓(xùn)經(jīng)驗(yàn)，課程大綱更科學(xué)更專業(yè)，有針對(duì)零基礎(chǔ)的就業(yè)班，有針對(duì)想提升技術(shù)的提升班，高品質(zhì)課程助理你實(shí)現(xiàn)夢(mèng)想。