Le contenu de cet article concerne le prototype de tableau encapsulé JS : une introduction à l'utilisation de la méthode de tri. Il a une bonne valeur de référence et j'espère qu'il pourra aider les amis dans le besoin.
J'ai récemment découvert l'encapsulation des méthodes intégrées sur le prototype du tableau, ce qui a renforcé ma capacité à encapsuler méthodes avec JS natif et compréhension plus approfondie du processus d'encapsulation des méthodes de tableau et des fonctions implémentées. Bien que je n'ai pas approfondi la couche inférieure et compris le code source. Les solutions suivantes sont toutes basées sur une compréhension personnelle des fonctions implémentées à l'aide de JS natif pur. S'il y a quelque chose qui ne va pas, vous pouvez me le dire dans les commentaires
首先,我们先来看一下sort方法的作用、参数、以及方法的返回值,原有数组是否发生改变
La méthode de tri est principalement utilisée pour trier les tableaux
paramètres Divisés en deux types :
Un : les paramètres passés sont des fonctions, (le tri dépend principalement de la valeur de retour de la fonction)
L'autre : Ce qui est passé n'est pas une fonction, ou n'est pas passé (tant que ce qui est passé n'est pas une fonction, cela n'aura aucun impact sur le processus de tri d'origine)
La valeur de retour de la méthode est le tableau trié du tableau d'origine
Le tableau d'origine a changé, c'est le tableau trié Array
其次,我们来看一下sort方法要处理的各种情况之间的比较
情况1:
Aucun paramètre pour implémenter le tri des tableaux de chaînes情况2:
Implémentation sans paramètre pour trier les tableaux de type numéro情况3:
Implémentation sans paramètre pour trier les tableaux de types mixtes tels que sous forme de chaînes et de nombres情况4:
Avec des paramètres pour implémenter le tri des données numériques de type numéro情况5:
Avec des paramètres, sort() trie les attributs personnalisés de l'objet simple List情况6:
Avec des paramètres, il implémente le tri de tableaux de types mixtes de chaînes et de nombres
sort方法对参数的处理:
Cas 1 : Si le paramètre n'est pas une fonction, cela n'affecte pas le processus de tri d'origine
Cas 2 : Si le paramètre est une fonction, il est basé sur la valeur de retour dans la fonction de rappel Sort. Si la valeur de retour est supérieure à 0, les positions sont échangées ; si la valeur de retour est inférieure à 0, les positions ne sont pas échangées
Si la valeur de retour n'est pas un nombre, les positions ne sont pas échangées
基于以上情况的讨论,sort方法实现的核心原理如下:
Principe de base : sans paramètres (et les paramètres avec ne sont pas des fonctions) : ordre croissant par défaut
Sans paramètres, convertir directement en chaînes et comparez les ASCII un par un La valeur du code
ne sera pas échangée tant que l'on est un objet {}
Lorsque le paramètre est une fonction :
Comparez selon la valeur de retour de la fonction ; si la valeur de retour de la fonction est supérieure à 0 ; alors échangez la position
实现代码如下:
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; };
实验结果
Recommandations associées :
Analyse de l'encapsulation des composants de liste déroulante dans Angular 6
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!