JS数组常用方法参考---5、sort方法
一、总结
一句话总结：
sort方法的作用是对数组进行排序，参数可以不带，也可以带一个排序函数，返回值是排序好的数组，sort方法会影响原数组，返回值的数组指向原数组
作用：对数组进行排序 参数：一个可选的排序函数 返回值：排序后的数组，指向原数组 是否影响原数组：影响 //1、arr基本使用 let arr=[13,4,2,34,5,1,17]; let new_arr=arr.sort(); console.log(arr); console.log(new_arr);
1、如何给sort函数指定排序规则？
直接在sort方法里面接一个匿名函数做排序函数即可，或者直接传一个排序函数进来
//2、指定排序规则 let arr=[13,4,2,34,5,1,17]; let new_arr2=arr.sort(function (a,b) { return a-b; }); console.log(arr); console.log(new_arr2);
2、sort方法如何对数组中的对象按照对象的属性进行排序？
直接在sort的排序函数中指定按照对象的属性进行排序即可，例如 根据value属性排序：return (a.value - b.value);
//3、对数组中的对象进行排序 let items = [ { name: 'Edward', value: 21 }, { name: 'Sharpe', value: 37 }, { name: 'And', value: 45 }, { name: 'The', value: -12 }, { name: 'Magnetic', value: 45 }, { name: 'Zeros', value: 37 } ]; // sort by value let new_item=items.sort(function (a, b) { return (a.value - b.value); }); console.log(items); console.log(new_item);
3、sort方法的排序函数中，如何给排序函数指定排序字段？
在原本的排序函数外面套一层函数（例如下面实例中的sortBy函数），来传递字段参数，原先的排序函数作为这个函数的返回值返回
let items = [ { name: 'Edward', value: 21 }, { name: 'Sharpe', value: 37 }, { name: 'And', value: 45 }, { name: 'The', value: -12 }, { name: 'Magnetic',value: 45}, { name: 'Zeros', value: 37 } ]; function sortBy(props) { return function(a,b) { return a[props] - b[props]; } } let new_item=items.sort(sortBy("value")); console.log(items); console.log(new_item);
4、sort函数排序中，如果年纪一样，就按照名字排序，否则按照年纪排序？
直接在排序函数中，写年纪一样比较名字的逻辑，年纪不一样就按年纪来的逻辑
//5、如果年纪一样，就按照名字排序，否则按照年纪排序 let arr=[ {name:'孙悟空',age:3}, {name:'唐僧',age:15}, {name:'猪八戒',age:14}, {name:'红孩儿',age:3}, {name:'琵琶精',age:13}, {name:'女儿国女王',age:13}, {name:'狐狸精',age:13} ]; let new_arr=arr.sort(function (a,b) { if(a.age==b.age){ return a.name>b.name?1:-1; }else if(a.age>b.age){ return 1; }else{ return -1; } }); console.log(arr); console.log(new_arr);
二、sort方法
博客对应课程的视频位置：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>sort方法</title> 6 </head> 7 <body> 8 <!-- 9 sort方法 10 作用：对数组进行排序 11 参数：一个可选的排序函数 12 返回值：排序后的数组，指向原数组 13 是否影响原数组：影响 14 15 --> 16 <script> 17 //1、arr基本使用 18 // let arr=[13,4,2,34,5,1,17]; 19 // let new_arr=arr.sort(); 20 // console.log(arr); 21 // console.log(new_arr); 22 // 23 // // new_arr.push(111); 24 // // console.log(arr); 25 // // console.log(new_arr); 26 27 28 //2、指定排序规则 29 // let arr=[13,4,2,34,5,1,17]; 30 // let new_arr2=arr.sort(function (a,b) { 31 // return a-b; 32 // }); 33 // console.log(arr); 34 // console.log(new_arr2); 35 36 //3、对数组中的对象进行排序 37 // let items = [ 38 // { name: 'Edward', value: 21 }, 39 // { name: 'Sharpe', value: 37 }, 40 // { name: 'And', value: 45 }, 41 // { name: 'The', value: -12 }, 42 // { name: 'Magnetic', value: 45 }, 43 // { name: 'Zeros', value: 37 } 44 // ]; 45 // 46 // // sort by value 47 // let new_item=items.sort(function (a, b) { 48 // return (a.value - b.value); 49 // }); 50 // console.log(items); 51 // console.log(new_item); 52 53 // let value_a=a.value===undefined?0:a.value; 54 // let value_b=b.value===undefined?0:b.value; 55 // return (value_a - value_b); 56 57 58 //4、指定排序字段 59 // let items = [ 60 // { name: 'Edward', value: 21 }, 61 // { name: 'Sharpe', value: 37 }, 62 // { name: 'And', value: 45 }, 63 // { name: 'The', value: -12 }, 64 // { name: 'Magnetic',value: 45}, 65 // { name: 'Zeros', value: 37 } 66 // ]; 67 // function sortBy(props) { 68 // return function(a,b) { 69 // return a[props] - b[props]; 70 // } 71 // } 72 // let new_item=items.sort(sortBy("value")); 73 // console.log(items); 74 // console.log(new_item); 75 76 // if(a[props] > b[props]) return 1; 77 // else if(a[props] < b[props]) return -1; 78 // return 0; 79 80 //5、如果年纪一样，就按照名字排序，否则按照年纪排序 81 // let arr=[ 82 // {name:'孙悟空',age:3}, 83 // {name:'唐僧',age:15}, 84 // {name:'猪八戒',age:14}, 85 // {name:'红孩儿',age:3}, 86 // {name:'琵琶精',age:13}, 87 // {name:'女儿国女王',age:13}, 88 // {name:'狐狸精',age:13} 89 // ]; 90 // let new_arr=arr.sort(function (a,b) { 91 // if(a.age==b.age){ 92 // return a.name>b.name?1:-1; 93 // }else if(a.age>b.age){ 94 // return 1; 95 // }else{ 96 // return -1; 97 // } 98 // }); 99 // console.log(arr); 100 // console.log(new_arr); 101 </script> 102 </body> 103 </html>