基础数据结构：「15]使用 for...in 语句迭代对象

路条编程 2021-03-03

306

欢迎关注路条编程网站，本专题将教您如何操作数组，以及如何访问和复制数组中的信息。它还将教您如何操作和访问 JavaScript 对象中的数据，同时使用点和括号表示法。

使用 for...in 语句迭代对象

有时候在开发过程中需要遍历一个对象中的所有键。这需要 JavaScript 中的一个特殊语法：for...in 语句。以遍历 Sites 对象的键为例：

let Sites = {
  icoderoad: {
    name: '路条编程',
    domain: 'www.icoderoad.ccom'
  },
  alipay: {
    name: '支付宝',
    domain: '支付宝www.alipay.com'
  },
  sohu: {
    name: '搜狐',
    address:'北京市'
  },
  qq: {
    name: '腾讯',
    domain: 'www.qq.com'
  },
  163:{
    name: '网易',
    address:'北京市'
  },
  cctv: {
    name: '央视网',
    domain: 'www.cctv.com'
  },
  weibo: {
    name: '微博',
    address:'北京市'
  }
};


for (let site in Sites) {
  console.log( site );
}


// =>
163
icoderoad
alipay
sohu
qq
cctv
weibo

在这个语句中，我们定义了一个 site 变量，您可以看到，这个变量在 for...in 语句中对对象的每一个键的遍历都会被重置。

注意：跟数组不同，对象中的键是无序的，因此一个对象中某个键的位置，或者说它出现的相对顺序，在引用或访问该键时是不确定的。

下面我们做个练习，定义了一个 getTotalNumByDomain 方法，使用 for...in 语句来遍历 Sites 对象中的网站信息，并返回包含域名 domain 属的网站数量。

function getTotalNumByDomain( sites ){
  let total = 0;
  for (let siteKey in sites) {
      var siteObj = sites[siteKey];
      if( siteObj.hasOwnProperty( 'domain' ) ){
          total++;
      }
  }
  return total;
}


console.log('共有包含域名的网站数：' + getTotalNumByDomain( Sites ));
// => 共有包含域名的网站数：4

以上代码我们定义了方法 getTotalNumByDomain，其中参数 sites 为站点对象。方法中定义了变量 total, 初始值为 0 ，通过 for...in 语句循环 sites 对象里的网站对象，通过对象的 hasOwnProperty 方法判断对象中是否包含指定属性 domain, 如果包含 total 变量值 + 1，最终将 total 变量返回。在控制台将 getTotalNumByDomain 方法返回值输出，最终控制台输出为 “共有包含域名的网站数：4”。

今天就讲到这里，如果有问题需要咨询，大家可以直接留言或扫下方二维码关注公众号。也可以添加 happyzjp 微信受邀加入学习社群，我们会尽力为你解答。练习网站已经正式上线，大家可以登陆网站 http://www.icoderoad.com 进行文章中示例的练习。

作者：路条编程（转载请获本公众号授权，并注明作者与出处）

数据库

文章转载自路条编程，如果涉嫌侵权，请发送邮件至：contact@modb.pro进行举报，并提供相关证据，一经查实，墨天轮将立刻删除相关内容。

基础数据结构：「15]使用 for...in 语句迭代对象

评论