JavaScript中将对象按照某个属性排序

一直没弄明白 a[value]这种访问对象属性的方式……今天懂了

  1. 可以通过点语法来存取,比如obj.name指的是访问obj对象上的name属性,但是此时对象上要有这个name属性,否则访问到的就是undefined
  2. 也可以使用中括号来存取属性,这两种存取属性的方式没有区别,使用中括号要在括号内使用属性名的字符串形式,就是可以通过变量访问属性。
    如果属性名中包含可以会导致语法错误的字符或者包含关键字、保留字时使用中括号语法。比如 first name中间有空格,不能使用点语法。
 		 var  obj={name:'test'}
        let propertyName='name'
        
        console.log(obj[propertyName]);//test
        console.log(obj.propertyName);//undefined

在这里插入图片描述


  • sort用法

默认情况下,sort()会按照升序重新排列数组元素,sort()会在每一项上调用String()转型函数,然后比较字符串来决定顺序,即使数组的元素都是数值,也会先把数组转换为字符串再比较排序。

       let nums=[0,1,5,10,15]
       console.log(nums.sort());

sort排序后的结果:根据字符串比较规则排序的……可不是数字
在这里插入图片描述

其中字符串105比较,这在多数情况下都不是最合适的,sort()方法可以接收一个比较函数,用于判断哪个值应该排在前面。

在这里插入图片描述

比较函数规则:

  1. 如果第一个参数应该排在第二个参数前面,就返回负值
  2. 如果两个参数相等,就返回0
  3. 如果第一个参数应该排在二个参数后面,就返回正值
        function compare(value1,value2){
            if(value1<value2){
                return 1
            }else if(value1>value2){
                return -1
            }else{
                return 0
            }
        }
        let values=[0,23,1,4,2]

        // sort方法传入比较函数,数组中的数值在排序后保持了正确的顺序
        console.log(values.sort(compare));// [23, 4, 2, 1, 0]
		//使用箭头函数的形式简写
        console.log(values.sort((a,b)=>a<b? 1:a>b?-1:0));// [23, 4, 2, 1, 0]
        //都是数值的时候可以更简洁点
        console.log(values.sort((a,b)=>b-a));

在这里插入图片描述


1.按照对象中的某个属性排序

  • value1此时表示的是数组中的每一个对象{},value1[property]是通过变量访问属性。
  function sortBy(property){
           return function(value1,value2){
               let a=value1[property]
               let b=value2[property]
               
               return a < b ? 1:a > b? -1 : 0
           }
         }

按照age排序:

	   let value=[{age:22},{age:88},{age:33}]
	  
       console.log(value.sort(sortBy('age')));

在这里插入图片描述


2.再加个是否升序排序,默认是升序。第二个参数不写,函数接收的ascundefined

        function sortBy(property, asc) {
            //默认升序,不能写在闭包里面,写在闭包里面是无效的……asc没反应就
            if (asc==undefined) {
                asc = -1
            } else {
                asc=asc ? -1 : 1
            }
            return function (value1, value2) {
                let a = value1[property]
                let b = value2[property]
                return a < b ? asc : a > b ? asc*-1 : 0
            }
        }
        console.log(value.sort(sortBy('age',true)));

在这里插入图片描述

3.更简洁方法

  1. 如果数组的元素是数值,或者是其valueOf方法返回数值的对象如Date对象,比较函数可以写的更简单,可以直接用第二个值减去第一个值。
  2. 比较函数就是要返回小于00和大于0的数值,减法操作完全可以满足要求。

在这里插入图片描述
对象按照属性排序:

  • 常规
 function sortBy(property){
           return function(value1,value2){
               let a=value1[property]
               let b=value2[property]
               return b-a
           }
         }
  • 是否升序
        function sortBy1(property,asc){
            return function (value1, value2) {
                let a = value1[property]
                let b = value2[property]
                // 默认升序
                if(asc==undefined){
                   return a-b
                }else{
                   return asc? a-b:b-a
                }
            }
        }
        // 第二种更简洁的方法
        console.log(value.sort(sortBy1('age',true)));

在这里插入图片描述

  • 9
    点赞
  • 13
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值