JavaScript高级 ES5新增的方法

数组方法

遍历数组

forEach()

语法: array(数组).forEach(function(currentValue,index,arr))
参数1 currentValue 数组当前项的值
参数2 index 数组当前项的索引值
参数3 arr 数组对象本身
在这里插入图片描述

filter()

语法: array(数组).filter(function(currentValue,index ,arr))

参数1 currentValue 数组当前项的值
参数2 index 数组当前项的索引值
参数3 arr 数组对象本身

虽然使用方法类似
但是filer()和forEach() 作用不一样
filer()方法创建一个新的数组 新数组中的元素是通过检查指定数组中符合条件的所有元素
主要用来筛选数组
需要注意的是
它返回的直接是一个新的数组
案例如下
筛选大于5的数
在这里插入图片描述

some()

语法: array(数组).some(function(currentValue,index ,arr))

参数1 currentValue 数组当前项的值
参数2 index 数组当前项的索引值
参数3 arr 数组对象本身

some()方法用于检测数组中的元素是否满足指定条件
简单的说 some()方法查找数组中是否有满足条件的元素

需要注意的是 some()方法返回的布尔值 如果查找的到这个元素 就返回true 如果查找不到就返回flase

如果找到第一个满足条件的元素 则终止循环 不再继续寻找

在这里插入图片描述

some() 和forEach()的区别

如果查询数组中唯一的元素, 用some方法更合适,在some 里面 遇到 return true 就是终止遍历 迭代效率更高
在forEach 里面 return 不会终止迭代

字符串

去除空白

trim()

trim()方法可以去除字符串两侧的空格 但不会去除字符串中间的空格
案例如下

  var str = '   an  dy   ';
        console.log(str);
        var str1 = str.trim();
        console.log(str1);

在这里插入图片描述
可以看到 两边的空白被去掉了 但是中间的空白却没有被去除

对象

遍历对象 Object.keys

语法 Object.keys(obj)

效果类似于for…in

返回的是一个属性名组成的数组

我们先创建一个对象

  var obj ={
      id:1,
      name:'摆烂波比',
      age : 21 
    }

然后用keys进行遍历

var arr = Object.keys(obj)

我们打印arr看看效果

在这里插入图片描述
但是我们需要注意的是 这个方法只能得到属性名 不能得到属性值

Object.defineProperty()

作用 :定义对象中新属性或修改原有属性
语法 : Object.defineProperty(obj,prop,descriptor)
需要注意的是在这个方法中 这三个参数是必须要有的
参数1 obj 代表对象
参数2 prop 代表需要定义或者需要修改的属性的名字
参数3 descriptor 代表目标属性所拥有的特效

首先我们先复习以下以前的对象是怎么添加和修改属性的
在这里插入图片描述
接下来我们用新方法来试试
这时候我们需要注意的是
Object.defindProperty()方法的第二参数需要打引号
Object.defineProperty()方法的第三个参数必须以对象的方式来书写
在这个参数中 存在四个选项

选项1 value : 设置属性的值

默认为underfined

   Object.defineProperty(obj,'age',{
        value : 20,
      })
      Object.defineProperty(obj,'size',{
        value: 18,     
      })

结果和之前一样
在这里插入图片描述

选项2 writable 设置属性值能否被重写

默认为false(不可重写)
我们分别设置 一个为true 一个为false 然后打印看看结果如何
在这里插入图片描述
可以看见 当我们设置的weitable属性为true时 属性可以被修改 为false时 属性不可以被修改
这里需要注意的是 在我们对象的原生属性是默认可以修改的

选项3 enumerable 设置目标属性是否可以被枚举 (就是是否可以被遍历)

默认值为false
同样的
我们分别设置true和false

 Object.defineProperty(obj,'age',{
    value : 20,
    weitable : true,
    enumerable : true,
  })
  Object.defineProperty(obj,'size',{
    value: 18,   
    weitable : false,
    enumerable:false
      
  }) 

然后我们利用key属性遍历这个对象
在这里插入图片描述
发现设置为false的size属性无法被遍历出来

选项4 设置目标属性能否被再次修改或是能否被删除

默认值false

  Object.defineProperty(obj,'age',{
        value : 20,
        weitable : true,
        enumerable : true,
        configurable : true
      })
      Object.defineProperty(obj,'size',{
        value: 18,   
        weitable : false,
        enumerable:false,
        configurable : false
          
      }) 
      delete obj.age
      delete obj.size

       console.log(obj);

在这里插入图片描述

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值