技术交流QQ群:1027579432，欢迎你的加入！
欢迎关注我的微信公众号：CurryCoder的程序人生
1.ES5新增方法概述
- ES5中给我们新增了一些方法，可以很方便的操作数组或字符串，这些方法主要包括：
- 数组方法
- 字符串方法
- 对象方法
2.数组方法
-
(迭代(遍历)方法：forEach()、map()、filter()、some()、every()。
// forEach()：遍历数组 var arr = new Array(1, 2, 3); var sum = 0; arr.forEach(function(value, index, array){ console.log('每个数组元素: ' + value); console.log('每个数组元素的索引号: ' + index); console.log('数组本身: ' + array); sum += value; }) console.log(sum); - forEach()方法语法规范：
- currentValue:数组当前项的值；
- index:数组当前项的索引；
- arr:数组对象本身；
array.forEach(function(currentValue, index, arr)) - filter()方法用于创建一个新的数组，新数组中的元素是通过检查指定数组中符合条件的所有元素，主要用于筛选数组。
- 注意：filter()方法直接返回一个新的数组。
// filter()筛选数组 var arr = new Array(1, 2, 3, 4, 5, 6); var newArr = arr.filter(function(value, index){ return value % 2 === 0; }) console.log(newArr); - filter()方法语法规范：
- currentValue:数组当前项的值；
- index:数组当前项的索引；
- arr:数组对象本身；
array.filter(function(currentValue, index, arr)) - some()方法用于检查数组中的元素是否满足指定条件，通过点查找数组中是否有满足条件的元素。
- 注意：它的返回值是布尔类型，如果查找到这个元素，就返回true，如果查找不到就返回false。
- 如果找到第一个满足条件的元素，则循环立即停止，不再继续查找。
// some()方法：检测数组中的元素是否存在满足条件的元素 var arr = [10, 24, 5]; var flag = arr.some(function(value){ return value >= 20; }) console.log(flag); var arr1 = ['red', 'pink', 'blue']; var flag1 = arr1.some(function(value){ return value === 'yellow'; }) console.log(flag1); - some()方法语法规范：
- currentValue:数组当前项的值；
- index:数组当前项的索引；
- arr:数组对象本身；
array.some(function(currentValue, index, arr))
3.字符串方法
- trim()方法会从一个字符串的两端删除空白字符。语法规范如下：
str.trim() -
trim()方法并不会影响原先字符串本身，它返回的是一个新的字符串。
<input type="text"><button>点击</button> <div></div> <script> // trim()方法删除字符串两侧空格 var str = ' Curry Coder '; console.log(str); var str1 = str.trim(); console.log(str1); var input = document.querySelector('input'); var btn = document.querySelector('button'); var div = document.querySelector('div'); btn.onclick = function(){ var str = input.value.trim(); if(str === ''){ alert('请输入内容'); } else { console.log(str); console.log(str.length); div.innerHTML = str; } } </script>
4.对象方法
- Object.keys()方法用于获取对象自身所有的属性。语法规范如下：
Object.keys(obj); - 效果类似于for ... in；
- 返回一个由属性名组成的数组；
// Object.keys()用于获取对象自身所有的属性 var obj = { name: '小米', price: 1999, type: 'mi9' }; var arr = Object.keys(obj); console.log(arr); arr.forEach(function(value){ console.log(value); }) - Object.defineProperty()方法用于定义新的属性或修改原来的属性。语法规范如下：
Object.defineProperty(obj, property, descriptor); - Object.defineProperty()第三个参数descriptor说明：以对象形式{}书写。
- value:设置属性的值，默认为undefined;
- writable:值是否可以重写，默认为false;
- enumerable:目标属性是否可以被枚举，默认为false;
- configurable:目标属性是否可以被删除或是否可以再次修改特殊，默认为false;
// Object.defineProperty()方法用于定义新的属性或修改原来的属性 var obj = { id: 1, name: '小米', price: 1999, type: 'mi9' }; // 以前对象添加和修改属性的方法 // obj.num = 10000; // console.log(obj); // obj.price = 99; // Object.defineProperty()方法用于定义新的属性或修改原来的属性 Object.defineProperty(obj, 'price', { value: 9.9 }); console.log(obj); Object.defineProperty(obj, 'num', { value: 10000, configurable: true }); Object.defineProperty(obj, 'id', { writable: false // 不允许修改这个属性值 }) obj.id = 2; // 无效修改 console.log(obj); Object.defineProperty(obj, 'address', { value: '地球村', writable: false, // 不允许修改这个属性值 enumerable: true, configurable: false }) var res = Object.keys(obj); console.log(res); delete obj.address; console.log(obj); delete obj.num; console.log(obj);
网友评论