我是靠谱客的博主 自觉星月,最近开发中收集的这篇文章主要介绍遍历、筛选for in / forEach()for ( attribute in Object ) {}forEach( callback[,thisArg )jQuery 中的eq()jQuery.each(object, [callback]),觉得挺不错的,现在分享给大家,希望可以做个参考。

概述

for ( attribute in Object ) {}

1. for…in 语句用于遍历数组或者对象的属性(对数组或者对象的属性进行循环操作)。

for (属性 in 对象)
{
在此执行代码
}

for-in循环应该用在非数组对象的遍历上,使用for-in进行循环也被称为“枚举”。

你可以使用for-in循环数组(因为JavaScript中数组也是对象),但是不推荐。在for-in中,属性列表的顺序(序列)是不能保证的。所以最好数组使用正常的for循环,对象使用for-in循环。

有个很重要的hasOwnProperty()方法,当遍历对象属性的时候可以过滤掉从原型链上下来的属性。


function Obj( name, age, sex ) {
this.name = name
this.age = age
this.sex = sex
}
Obj.prototype.show = function() {}
var obj = new Obj( "liu", 33, "man" )

为了避免枚举obj的时候出现show()方法,你需要应用hasOwnProperty()方法过滤原型属性。如果不做过滤,会导致show()函数显示出来。

// 无hasOwnProperty()
for ( var i in obj ) {
console.log( i )
}
// 结果:name age sex show
for ( var i in obj ) {
console.log( obj[ i ] )
}
// 结果:liu 33 man
function Obj.prototype.show()
// 有hasOwnProperty()
for ( var i in obj ) {
if ( obj.hasOwnProperty( i ) ) {
console.log( i );
}
}
// 结果:name age sex
for ( var i in obj ) {
if ( obj.hasOwnProperty( i ) ) {
console.log( obj [ i ] );
}
}
// 结果:liu 33 man

另外一种使用hasOwnProperty()的形式是取消Object.prototype上的方法。


var hasOwn = Object.prototype.hasOwnProperty
for ( var i in obj ) {
if ( hasOwn.call( obj, i ) ) {
console.log( i, ":", obj[ i ] );
}
}

优点:对象重新定义hasOwnProperty情况下避免命名冲突。也避免了长属性查找对象的所有方法,你可以使用局部变量“缓存”它。

forEach( callback[,thisArg )

forEach( function( currentValue, index, array ) {},thisArg )
//currentValue: 当前索引的值。
index:索引值。
array:数组本身。
var arr = [ 2, 4, 2, 6, 5 ]
arr.forEach( function( cV, index, array ) {
console.log( cV ) // 2 4 2 6 5
console.log( 1 )
//0 1 2 3 4

console.log( arr )
// 五个:Array [ 2, 4, 2, 6, 5 ]
} )

参照:
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach

小结:
(1) 遍历数组,建议使用原生的遍历方法for或forEach(存在兼容性问题),因为for in 和for each in均存在浏览器的兼容问题。

(2)遍历对象,建议使用for in,for in比for each 更具优势。

jQuery 中的eq()

获取当前链式操作中第N个jQuery对象,返回jQuery对象,当参数大于等于0时为正向选取,比如0代表第一个,1代表第二个。当参数为负数时为反向选取,比如-1为倒数第一个,具体可以看以下示例。

<script src="js/jquery.js"></script>
<p>11111111</p>
<p>22222222</p>
<p>33333333</p>
<p>44444444</p>
$( function() {
$( "p" ).eq( -1 ).css( "color", "red" )
} )
// 效果:值为4的变红。

jQuery.each(object, [callback])

通用例遍方法,可用于例遍对象和数组。

不同于例遍 jQuery 对象的 $().each() 方法,此方法可用于例遍任何对象。回调函数拥有两个参数:第一个为对象的成员或数组的索引,第二个为对应变量或内容。如果需要退出 each 循环可使回调函数返回 false,其它返回值将被忽略。

$().each()用法与此相同;回调两个参数一样。

操作对象:


var obj = {
name: "liu",
age: 33,
sex: "man"
}
jQuery.each( obj, function( i, v ) {
console.log( i )
console.log( v )
} )

操作数组:


var arr = [ 1, 3, 5, 6, 7 ]
jQuery.each( arr, function( i, v ) {
console.log( i )
console.log( v )
} )

最后

以上就是自觉星月为你收集整理的遍历、筛选for in / forEach()for ( attribute in Object ) {}forEach( callback[,thisArg )jQuery 中的eq()jQuery.each(object, [callback])的全部内容,希望文章能够帮你解决遍历、筛选for in / forEach()for ( attribute in Object ) {}forEach( callback[,thisArg )jQuery 中的eq()jQuery.each(object, [callback])所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(60)

评论列表共有 0 条评论

立即
投稿
返回
顶部