ES5新增方法(Array-String)

数组方法

数组实例

  • forEach()遍历数组
var arr=[1,2,3]
arr.forEach((value,index,array)=>{
  console.log(value, '数组元素')
  console.log(index, '索引')
  console.log(array, '数组本身')
})
  • map()遍历数组
  • filter()筛选数组
var arr=[1,2,3,12,66,4,88]
const res=arr.filter((value,index,array)=>{
  // 返回到新数组
  return value>=20;
})
console.log(res, '')
  • some()是否满足条件
var arr=[1,2,3,12,66,4,88]
var fla=arr.some((value,index,array)=>{
  // 找到之后停止查找
  return value>=20;
})
console.log(fla, '返回bool')
  • every()查询是否存在

查询实例

  <table class="table">
    <thead>
      <tr>
        <th>id</th>
        <th>名称</th>
        <th>价格</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td></td>
        <td></td>
        <td></td>
      </tr>
    </tbody>
  </table>
<script>
    var data=[
      {
        id:1,
        name:'小米',
        price:1999
      },
      {
        id:2,
        name:'小米2',
        price:19
      },
      {
        id:3,
        name:'小米3',
        price:199
      },
      {
        id:4,
        name:'小米4',
        price:19993
      }
    ]
    // 获取相应元素
    var tbody=document.querySelector('tbody');
    var search_price=document.querySelector('.search_price');
    var start=document.querySelector('.start')
    var end=document.querySelector('.end')
    var product=document.querySelector('.product')
    var search_pro=document.querySelector('.search_pro')
    // 渲染数据
    setData(data)
    // 封装数据渲染
    function setData(mydata) {
      tbody.innerHTML=''
      mydata.forEach(value=>{
        console.log(value);
        var tr=document.createElement('tr');
        tr.innerHTML=`<td>${value.id}</td><td>${value.name}</td><td>${value.price}</td>`;
        tbody.append(tr);
      })
    }
    // 查询价格
    search_price.addEventListener('click',()=>{
      var newData=data.filter((value)=>{
        return value.price>=start.value&&value.price<=end.value
      })
      console.log(newData, '')
      // 渲染
      setData(newData)
    })
    // 按照名称查询
    // 效率更高,找到不再执行
    search_pro.addEventListener('click',()=>{
      var arr=[]
      data.some((value)=>{
        if(value.name===product.value){
          arr.push(value)
          return true;
        }
      })
      setData(arr)
    })
</script>

forEach()与some()的区别

forEach查找数组内容会遍历完
some找到内容后直接退出循环

字符串方法

  • trim()
    去除字符串两端空白字符,返回字符串
  • Object.keys()
    获取对象自身所有属性,返回一个属性名的数组,可把值用forEach遍历出来
  • Object.defineProperty(obj,prop,descriptor)
    给对象增加属性或者修改原有属性
    descriptor:{
    value:***,
    writable:true, //是否可以重写
    enumerable:true, //是否枚举,是否显示
    configurable:false //可否被操作(比如删除
    }
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值