36 ES5中新增的方法

技术交流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);

5.资料下载

笔记及代码，欢迎 star,follow,fork…

36 ES5中新增的方法相关推荐

带你学习ES5中新增的方法
文章目录 1. ES5中新增了一些方法,可以很方便的操作数组或者字符串,这些方法主要包括以下几个方面 2. 数组方法 2.1 forEach跟jQuery的each用法类似.语法是: 2.2 map( ...
ES6/02/创建对象，构造函数和原型，原型和原型链，this指向，类，ES5新增的方法，数组方法，回调函数，ES5新增的字符串方法，ES5中新增的对象方法
创建对象 1,利用new Object()创建对象 var obj1 =new Object(); 2,利用对象字面量创建对象 var obj2={}; 3,利用构造函数创建对象 function S ...
ES5中新增的Array方法详细说明
一.前言-索引 ES5中新增的不少东西,了解之对我们写JavaScript会有不少帮助,比如数组这块,我们可能就不需要去有板有眼地for循环了. ES5中新增了写数组方法,如下: forEach (j ...
ES6中新增字符串方法，字符串模板
ES6中新增字符串方法,字符串模板多了两个新方法 startsWith endsWith 返回的是一个Boolean值 let str='git://www.baidu.com/2123123';i ...
Java8 Map中新增的方法使用总结
前言得益于 Java 8 的 default 方法特性,Java 8 对 Map 增加了不少实用的默认方法,像 getOrDefault, forEach, replace, replaceAll, ...
Java8 Map 中新增的方法使用记录
得益于 Java 8的 default方法特性,Java 8对 Map增加了不少实用的默认方法,像getOrDefault,forEach,replace,replaceAll,putIfAbsent ...
es5的data语法_ES5中新增的Array方法详细说明
一.前言 ES5中新增的不少东西,了解之对我们写JavaScript会有不少帮助,比如数组这块,我们可能就不需要去有板有眼地for循环了. ES5中新增了写数组方法,如下: forEach (js v ...
ES6中新增数组遍历方法
ES6中新增的方法遍历方法: forEach(),fifter(),some(): array.forEach(function(currentValue,index,arr)) // curren ...
ES6中字符串和数组新增的方法
ES6中字符串和数组新增的方法一.字符串中新增的方法 1.模板字符串 (表达式.函数的调用.变量) 2.repeat(次数)函数 : 将目标字符串重复N次,返回一个新的字符串,不影响目标字符串 3. ...