当前位置:网站首页>带你学习ES5中新增的方法
带你学习ES5中新增的方法
2020-11-06 20:37:29 【叫我詹躲躲】
文章目录
1. ES5中新增了一些方法,可以很方便的操作数组或者字符串,这些方法主要包括以下几个方面
- 数组方法
- 字符串方法
- 对象方法
2. 数组方法
迭代遍历方法:forEach()、map()、filter()、some()、every()
判断方法:isArray()
2.1 forEach跟jQuery的each用法类似。语法是:
array.forEach(function(currentValue, index, arr))
- currentValue: 数组当前项的值
- index: 数组当前项的索引
- arr: 数组对象本身
var arr = [1,2,3]
arr.forEach(function(value, index, array){
console.log('每个数组元素'+ value)
console.log('每个数组元素的索引值'+ index)
console.log('数组本身'+ array)
})
运行效果如下图
2.2 map()
array.map(function(currentValue, index, arr))
map() 方法创建一个新数组,其结果是该数组中的每个元素都调用一个提供的函数后返回的结果。
注意:map() 方法是直接返回一个新的数组
- currentValue: 数组当前项的值
- index: 数组当前项的索引
- arr: 数组对象本身
var array1 = [1, 4, 9, 16];
var map1 = array1.map(function(value, index, arr) {
return value * 2
});
console.log(map1) //[2,8,18,32]
2.3 filter()
array.filter(function(currentValue, index, arr))
filter()方法用于筛选创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素,主要用于筛选数组。
filter()方法是直接返回一个新的数组
- currentValue: 数组当前项的值
- index: 数组当前项的索引
- arr: 数组对象本身
var arr = [12,66,88]
// 选出大于20的
var newarr = arr.filter(function(value, index){
return value >=20
})
可以简写成var newarr = arr.filter( //[66, 88])
console.log(newArr) //[66, 88]
预览效果如下图
2.4 some()
array.some(function(currentValue, index, arr))
some()方法用于检测数组中的元素是否满足指定条件,通俗点查找数组中是否有满足条件的元素
注意: some()方法返回值是布尔值,如果查找到这个元素,就返回true,如果查找不到则返回false
如果找到第一个满足条件的元素,则终止循环,不在继续查找
- currentValue: 数组当前项的值
- index: 数组当前项的索引
- arr: 数组对象本身
var arr=[10,30,4]
var b = arr.some(function(value){
return value > 20
})
console.log(b) //true
2.5 every()
array.every(function(currentValue, index, arr))
every() 方法测试一个数组内的所有元素是否都能通过某个指定函数的测试。它返回一个布尔值。
注意:every() 方法必须每个元素都符合条件才能返回true,若有一个不符合,则返回false。
若收到一个空数组,此方法在一切情况下都会返回 true。
- currentValue: 数组当前项的值
- index: 数组当前项的索引
- arr: 数组对象本身
2.6 isArray()
Array.isArray(obj)
Array.isArray() 用于确定传递的值是否是一个 Array
- obj是需要检测的值。如果是数组则返回true,否则返回false
区别:
- filter 是查找满足条件的元素,返回的是一个数组,而且是把所有满足条件的元素返回回来
- some 是查找满足条件的元素是否存在,返回的是一个布尔值,如果查找第一个满足条件的元素,就终止循环。如果数组中查询唯一个元素,用some方法更为合适,因为它找到这个元素,就不在进行循环,效率更高
- every是查找所有的元素是否符合条件,返回的是一个布尔值
- map是创建一个新数组,其结果是该数组中的每个元素都调用一个提供的函数后返回的结果
3. 字符串方法
trim() 方法会从一个字符串的两端删除空白字符
str.trim()
trim() 方法并不影响原字符串本身,它返回的是一个新字符串。
4. 对象方法
Object.defineProperty()定义对象中新增属性或修改原有的属性
Object.defineProperty(obj, prop, descriptor)
- obj: 必需。目标对象
- prop: 必需。 需定义或修改的属性名字
- descriptor: 必需。目标属性所拥有的特性
Object.defineProperty() 第三个参数descriptor说明: 以对象形式{}书写
- value:设置属性的值,默认为undefined
- writable:值是否可以重写。true | false 默认为false
- enumerable: 目标属性是否可以被枚举。true | false 默认为false
- configurable: 目标属性是否可以被删除或是否可以再次修改特性true | false 默认为false
var obj = {
id: 1,
pname: '小米',
price: 1999
}
//以前的对象添加和修改属性的方式
obj.num = 1000
obj.pirce = 99
console.log(obj)
//Object.deefineProperty()定义新属性或者修改原有的属性
Object.defineProperty(obj, 'num',{
value: 1000,
})
Object.defineProperty(obj, 'pricee',{
value: 9.9,
})
Object.defineProperty(obj, 'id',{
//如果值为false,则不允许修改
writable: false,
})
Object.defineProperty(obj, 'address',{
value: '中国郑州市',
//如果值为false,则不允许遍历,枚举
enumerable: false
})
console.log(obj)
console.log(Object.keys(obj))
总结
本篇文章主要分享了ES5新增的一些方法,有数组方法、字符串方法、对象方法等等,主要分享了哥方法的用法,特点等等。
版权声明
本文为[叫我詹躲躲]所创,转载请带上原文链接,感谢
https://my.oschina.net/u/3995971/blog/4558944
边栏推荐
- C++ 数字、string和char*的转换
- C++学习——centos7上部署C++开发环境
- C++学习——一步步学会写Makefile
- C++学习——临时对象的产生与优化
- C++学习——对象的引用的用法
- C++编程经验(6):使用C++风格的类型转换
- Won the CKA + CKS certificate with the highest gold content in kubernetes in 31 days!
- C + + number, string and char * conversion
- C + + Learning -- capacity() and resize() in C + +
- C + + Learning -- about code performance optimization
猜你喜欢
-
C + + programming experience (6): using C + + style type conversion
-
Latest party and government work report ppt - Park ppt
-
在线身份证号码提取生日工具
-
Online ID number extraction birthday tool
-
️野指针?悬空指针?️ 一文带你搞懂!
-
Field pointer? Dangling pointer? This article will help you understand!
-
HCNA Routing&Switching之GVRP
-
GVRP of hcna Routing & Switching
-
Seq2Seq实现闲聊机器人
-
【闲聊机器人】seq2seq模型的原理
随机推荐
- LeetCode 91. 解码方法
- Seq2seq implements chat robot
- [chat robot] principle of seq2seq model
- Leetcode 91. Decoding method
- HCNA Routing&Switching之GVRP
- GVRP of hcna Routing & Switching
- HDU7016 Random Walk 2
- [Code+#1]Yazid 的新生舞会
- CF1548C The Three Little Pigs
- HDU7033 Typing Contest
- HDU7016 Random Walk 2
- [code + 1] Yazid's freshman ball
- CF1548C The Three Little Pigs
- HDU7033 Typing Contest
- Qt Creator 自动补齐变慢的解决
- HALCON 20.11:如何处理标定助手品质问题
- HALCON 20.11:标定助手使用注意事项
- Solution of QT creator's automatic replenishment slowing down
- Halcon 20.11: how to deal with the quality problem of calibration assistant
- Halcon 20.11: precautions for use of calibration assistant
- “十大科学技术问题”揭晓!|青年科学家50²论坛
- "Top ten scientific and technological issues" announced| Young scientists 50 ² forum
- 求反转链表
- Reverse linked list
- js的数据类型
- JS data type
- 记一次文件读写遇到的bug
- Remember the bug encountered in reading and writing a file
- 单例模式
- Singleton mode
- 在这个 N 多编程语言争霸的世界,C++ 究竟还有没有未来?
- In this world of N programming languages, is there a future for C + +?
- es6模板字符
- js Promise
- js 数组方法 回顾
- ES6 template characters
- js Promise
- JS array method review
- 【Golang】️走进 Go 语言️ 第一课 Hello World
- [golang] go into go language lesson 1 Hello World