這篇文章要跟大家介紹的文章內容是關於JS封裝陣列原型：sort方法的使用介紹，有很好的參考價值，希望可以幫助到有需要的朋友。
基於原生JS封裝陣列原型上的sort方法
最近學習了陣列的原型上內建方法的封裝，加強了用原生JS封裝方法的能力，也進一步理解數組方法封裝的過程，實現的功能。雖然沒有深入底層，了解源碼。以下解法都是基於個人理解用純原生JS實現的功能。如有不對的地方，可以評論告訴我喲
首先，我們先來看sort方法的作用、參數、以及方法的回傳值，原有數組是否發生改變
sort方法主要用於陣列的排序
參數分為兩種：
#情況1：無參實作對字串數組的排序
情況3：無參實作對字串、number等混合類型的陣列的排序
情況4：
帶參實現對number類型的數值資料排序
#情況5：帶參詞sort()對簡單物件List的自訂屬性排序
sort方法對參數的處理：
情況1：如果參數不是函數，則不影響原來排序過程情況2：如果參數是函數，則根據回呼函數中的傳回值進行排序。如果傳回值大於0，則交換位置；如果傳回值小於0，則不交換位置如果傳回值不是一個數字，則不交換位置
基於以上情況的討論，sort方法實現的核心原理如下：
核心原理：不帶參（以及帶的參數不是函數）的情況下:默認升序排列
不帶參的情況下，直接轉字串，逐一比較ASCII碼的值
只要有一個是物件{}就不交換
帶參數為函數的情況下：
根據函數的傳回值進行比較；如果函數傳回值大於0；則交換位置
實作程式碼如下：
Array.prototype.mySort = function(fn){
if(Object.prototype.toString.call(fn)==='[object Function]'){
//如果传进来参数的是函数
for(var i = 0;i<this.length-1;i++){
//遍历数组,将前后两项作为实参传给fn
if(fn.call(this,this[i],this[i+1])>0){
//如果fn执行之后的返回值大于0.就调用swap方法交换位置
var a = this[i],b=this[i+1];
this[i] = swap(a,b).a;
this[i+1] = swap(a,b).b;
//交换之后，如果当前项不是第一项，则当前项(索引为i的项)继续跟前面的项进行比较
if(i>0){
for(var j = i-1;j>=0;j--){
if(fn.call(this,this[j],this[j+1])>0){
var a = this[j],b=this[j+1];
this[j] = swap(a,b).a;
this[j+1] = swap(a,b).b;
}
}
}
}
}
}else{
//如果不是函数，则按正常排序
//遍历数组，将前后两项进行比较
for(var i = 0;i<this.length-1;i++){
var cur = this[i];//当前项
var next = this[i+1];//下一项
if(comASCII(cur,next)){
//当返回true的时候交换，并且交换完成之后，当前项继续往前比较
this[i] = swap(cur,next).a;
this[i+1] = swap(cur,next).b;
//当前项继续向前比较
if(i>0){
for(var k = i-1;k>=0;k--){
var cur = this[k];
var next = this[k+1];
if(comASCII(cur,next)){
this[k] = swap(cur,next).a;
this[k+1] = swap(cur,next).b;
}
}
}
}
}
}
//封装一个交换位置的函数
function swap(a,b){
return {
a:b,
b:a
}
}
//如果不传参的情况下比较ASCII码
function comASCII(cur,next){
//全部转换为字符串、逐项比较ASCII码
cur = cur.toString();
next = next.toString();
//取长度最大值
var len = cur.length>next.length?next.length:cur.length;
//当前后两项都不是不是{}类型的数据时，进行比较
if(cur!=='[object Object]'&&next!=='[object Object]'){
for(var j = 0;j<len;j++){
if(!isNaN(cur.charCodeAt(j))&&!isNaN(next.charCodeAt(j))){
//如果二者的ASCII码都是有效数字
if(cur.charCodeAt(j)>next.charCodeAt(j)){
//如果前一项比后一项当前的ASCII码大，则返回true，交换位置
return true;
}else if(cur.charCodeAt(j)==next.charCodeAt(j)){
//如果相等直接进入下一轮循环
continue;
}else{
//前项比后项小，直接返回false
return false;
}
}
}
if(!isNaN(cur.charCodeAt(len))&&isNaN(next.charCodeAt(len))&&(cur.charCodeAt(len-1)==next.charCodeAt(len-1))){
//比较完之后，如果前一项ASCII还是有效数字，说明前项比后项大，交换
return true;
}
}
//如果上述条件不满足，则不交换
return false;
}
//返回当前数组
return this;
};登入後複製
實驗結果
無參（參數非函數）對純數字數組的排序
帶參對純數字數組的排序（升序）
帶參對純數字數組的排序（降序）
#無參（參數非函數）對純字母字串陣列的排序
帶參（參數是函數）對純字母字串陣列的排序（升序）
#帶參（參數是函數）對純字母字串陣列的排序（降序）
#無參（參數非函數）對純字母字串、數字字母組合字串、純數字字串組合的排序###############帶參（參數是函數）對純字母字串、純數字、數字字母字串、純數字字串等的組合排序結果（升序）###############帶參（參數是函數）對純字母字串、純數字、數字字母字串、純數字字串等的組合排序結果（降序）###############無參（參數非函數）對純字母字串、純數字、數字字母字串、純數字字串等的組合排序結果## ##########
帶參（參數是函數）對純字母字串、純數字、數字字母字串、純數字字串等的組合排序結果（升序）
#帶參（參數是函數）對純字母字串、純數字、數字字母字串、純數字字串等的組合排序結果（降序）
無參（參數非函數）對陣列、純字母字串、純數字、數字字母字串、純數字字串等的排序
#帶參（參數是函數）對陣列、純字母字串、純數字、數字字母字串、純數字字串等的排序（升序）
#帶參（參數是函數）對陣列、純字母字串、純數字、數字字母字串、純數字字串等的排序（降序）
#帶參（參數是函數）對純數組的排序（升序）
帶參（參數是函數）對純數組的排序（降序）
帶參（參數是函數）對純物件的排序（升序）
#帶參（參數是函數）對純物件的排序（降序）
相關推薦：
##對Angular 6中滾動清單元件的封裝的分析
以上是JS封裝數組原型：sort方法的使用介紹的詳細內容。更多資訊請關注PHP中文網其他相關文章！
