数组对象方法排序

最新推荐文章于 2022-02-07 23:55:55 发布

weixin_30455023

最新推荐文章于 2022-02-07 23:55:55 发布

阅读量96

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/happybread/p/8312978.html

版权

数组对象方法排序:

function sortByKey(array,key){

return array.sort(function(a,b){

var x=a[key];

var y=b[key];

return ((x<y)?-1:((x>y)?1:0));

});

}

示例如下：该例子配合使用的是vue

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title>v-for</title>
   <script src="../assets/js/vue.js"></script>
</head>
<body>
   <h1>v-for</h1>
   <hr>
   <div id="app">
       <ul>
           <li v-for="item in setItems">{{item}}</li>
       </ul>
       <hr>
       <ul>
           <li v-for="(student,index) in setStudents">
               {{index+1}}:{{student.name}}-{{student.age}}
           </li>
       </ul>
   </div>
   <script type="text/javascript">
       var app = new Vue({
           el: '#app',
           data: {
               items: [53,23,7,14],
               students:[
                   {name:'tpp', age: 25},
                   {name:'ldh', age: 27},
                   {name:'jxy', age: 24},
                   {name:'whh', age: 28},
                   {name:'xuj', age: 4}
               ]
           },
           computed:{//计算属性，会保护items原有的值，所以需要重新定义名字
               setItems:function(){
                   return this.items.sort(sortNum);
               },
               setStudents: function(){
                   return sortByKey(this.students,'age')
               }
           }
       });
       function sortNum(a,b){//数字从小到大的排序函数
           return a-b;
       };
       //数组对象方法排序:
       function sortByKey(array,key){
           return array.sort(function(a,b){
              var x=a[key];
              var y=b[key];
              return ((x<y)?-1:((x>y)?1:0));
           });
       }
   </script>
</body>
</html>

转载于:https://www.cnblogs.com/happybread/p/8312978.html