遍历数组
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>js遍历数组</title>
</head>
<style>
ul li{
margin: 20px 0;
}
</style>
<body>
<ul>
<li>
1、使用forEach遍历
</li>
<li>
2、使用for..in..遍历
</li>
<li>
3、使用for-of遍历
支持 数组,
支持 类数组对象,例如DOM NodeList对象.
支持 字符串遍历,(它将字符串视为一系列的Unicode字符来进行遍历).
</li>
<li>
4. for(var i=0;i<arr.length;i++){}
</li>
</ul>
</body>
<script>
let arr = ['a','b',533];
//1、使用forEach遍历
arr.forEach((val,index)=>{
console.log(index,val);
})
console.log('forEach ----------end')
//2、使用for..in..遍历
for(let i in arr){
console.log(i,arr[i]);
}
console.log('for..in..----------end')
//3、for..of.. 遍历
for(var val of arr){
console.log(val);
}
console.log('for..of..----------end')
</script>
</html>
遍历对象
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>javascript 遍历对象</title>
</head>
<style>
ul li{
margin: 20px 0;
}
</style>
<body>
<ul>
<li>
1、使用Object.keys()遍历<br/>
返回一个数组。先通过Object.keys()获取对象的键的集合数组,再通过forEach遍历数组,依此获取键,再通过键,依此获取对象的值
(不含Symbol属性)(不含不可枚举属性)(不含可继承的属性)
</li>
<li>
2、使用for..in..遍历<br/>
循环遍历对象自身的和继承的可枚举属性(不含Symbol属性)(不含不可枚举属性)(包含继承的属性).
</li>
<li>
3、使用Object.getOwnPropertyNames(obj)遍历 <br/>
返回一个数组,包含对象自身的所有属性(不含Symbol属性)(包含不可枚举属性)(不含继承的属性).
</li>
<li>
4、使用Reflect.ownKeys(obj)遍历<br/>
返回一个数组,包含对象自身的所有属性,(包含Symbol属性)(包含不可枚举属性)(不含继承的属性)
</li>
</ul>
</body>
<script>
function Person(){
this.name = 'duzuiliunian';
this.hellow = function () {
console.log('hellow');
}
}
Person.prototype.say = function(){ //继承属性
alert('继承属性值');
}
let obj = new Person();
obj[Symbol('h')] = 'Symbol属性值'; //Symbol属性
Object.defineProperty(obj,'weight',{
value:'不可枚举属性值',
enumerable:false //不可枚举
})
//1、使用Object.keys()遍历,返回所有可枚举的键的数组(不含继承的)(不含Symbol属性)
Object.keys(obj).forEach((key,index)=>{
console.log(index,key,obj[key]);
})
console.log('1.-----------------end')
//2、使用for..in..遍历
for(let i in obj){
console.log(i,obj[i]);
}
console.log('2.-----------------end')
//3、使用Object.getOwnPropertyNames(obj)遍历
Object.getOwnPropertyNames(obj).forEach((key)=>{
console.log(key,obj[key]);
})
console.log('3.-----------------end')
//4、Reflect.ownKeys(obj)遍历
Reflect.ownKeys(obj).forEach((key)=>{
console.log(key,obj[key]);
})
console.log('4.-----------------end')
</script>
</html>