排序方法返回值疑惑求解惑！

最新推荐文章于 2022-05-06 22:31:57 发布

D1sappearRy

最新推荐文章于 2022-05-06 22:31:57 发布

阅读量324

点赞数 1

分类专栏：学习文章标签：新手求解

本文链接：https://blog.csdn.net/D1sappearRy/article/details/102676064

版权

学习专栏收录该内容

7 篇文章 1 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <title>Title</title>
  </head>
  <body>
  <!--
    1. 列表过滤
    2. 列表排序
    -->
    <div id="demo">
      <input type="text" v-model="searchName">
      <ul>
        <!--
        遍历
        -->
        <li v-for="(p,index) in filterPersons" :key="index">
          {{index}}---{{p.name}}---{{p.age}}
        </li>
      </ul>
      <button @click="setOrderType(1)">年龄升序</button>
      <button @click="setOrderType(2)">年龄降序</button>
      <button @click="setOrderType(0)">原本顺序</button>
    </div>
  <script type="text/javascript" src="../js/vue.js"></script>
  <script type="text/javascript" src="../js/jquery-1.10.1.js"></script>
  <script type="text/javascript">
    const vm = new Vue({ //构建Vue实例对象vm （VM）
      el:'#demo', //选择器 Model层
      data:{  //View视图层
        persons:[
          {name:'Tom',age:19},
          {name:'Bob',age:14},
          {name:'Joe',age:16},
          {name:'Henry',age:18}
        ],
        //初始化搜索栏数据
        searchName:'',
        //初始化setOrderType的参数orderType 0为原本顺序 规定 1为升序 2为降序
        orderType: 0
      },
      computed:{ //计算属性
        filterPersons() {
          // console.log(this);
          const {persons,searchName,orderType} = this; //初始化数据
          let arr = [...persons];
          //实现列表过滤功能
          if (searchName.trim()) {
            arr = persons.filter(p => p.name.indexOf(searchName) !== -1);
          }
          //实现按键点击排序功能
          if (orderType) {
            //排序方法
            arr.sort(function (p1,p2) {
              if (orderType===1) {
                return p1.age - p2.age;
              }else {
                return p2.age - p1.age;
              }
            });
          }
          return arr; //返回数组arr
        }
      },
      methods:{
        //列表排序
        setOrderType(orderType) {
          // console.log(this);
          this.orderType = orderType //将规定好的点击函数参数赋值给vm的orderType属性
        }
      }
    });
  </script>
  </body>
</html>

求解惑计算属性那里关于排序方法的返回值是否sort()方法的返回值都为负数？