一、复习

【练习】

场景：根据obj这个对象 生成一个下边的字符串 然后把这个字符串放到h1中
name是珠峰，age是13；

Object.prototype.qq = 123;
  var obj = {
    name: "珠峰",
    age: 13
  }
  let str = ''
  /* for (let k in obj) {
    // debugger
    // var str = ''
    // k 代表  obj中的属性名
    if (obj.hasOwnProperty(k)) {
      // k是obj的私有属性；
      // console.log(k, obj[k])
      str += `${k}是${obj[k]};`
    }
  } */
  // let ary = Object.keys(obj)
  // ary.forEach(function (k) {
  //   // k 是个形参 代表了数组中的每一项；数组中的都是啥--》obj的私有属性名
  //   // k 代表的就是obj中的每一个私有属性名； obj[k]
  //   str += `${k}是${obj[k]};`
  // })
  Object.keys(obj).forEach(k => str += `${k}是${obj[k]};`) //k=>{return str += `${k}是${obj[k]};`}
  console.log(str)
  h1.innerHTML = str

• 作用域： --》怎么找变量？ --》 作用域链 单例
• 面向对象： --》 原型 原型链
• 类 实例（人类和张三的关系）

// Array  [] new Array
  // Object  {}  new Object
  // String   'erer'  new String
  // Number   123312  new Number
  // Person    new Person

• 实例的__proto__一定是和所属类的prototype是一个地址

二、排序

【通过对象属性排序问题】

• lis.sort(function(a,b){ return a.属性名-b.属性名 }) //在属性值是数字的情况下可以这样写；否则需要把return后边的代码改为return a.属性名.localeCompare(b.属性名)；此时排序为字母排序

  // ul.innerHTML = `<li>姓名小红；年龄10岁</li>
  //   <li>姓名小红2；年龄120岁</li>
  //   <li>姓名小红3；年龄130岁</li>
  //   <li>姓名小红4；年龄140岁</li>
  //   <li>姓名小红5；年龄150岁</li>`
  var list = [{
      name: "小红",
      age: 10
    },
    {
      name: "站三",
      age: 120
    },
    {
      name: "里斯",
      age: 140
    },
    {
      name: "王五",
      age: 105
    },
    {
      name: "小名5",
      age: 106
    }
  ]
  render()
  let flag = 1; // 1生  -1 降
  btn.onclick = function () {
    // 把list数组按照 age属性进行升序排序
    flag *= -1;
    list.sort((a, b) => {
      // return a.name.localeCompare(b.name)
      return (a.age - b.age) * flag
    })
    render()
  }

  function render() {
    // 根据list去渲染 ul的内容
    let str = '';
    list.forEach(item => {
      str = str + `<li>姓名是${item.name},年龄是${item.age}岁</li>`
    })
    ul.innerHTML = str; // innerHTML innerText
  }