for ... in ...和 for .. of ...的用法

最新推荐文章于 2022-06-22 14:27:07 发布

前端~

最新推荐文章于 2022-06-22 14:27:07 发布

阅读量98

点赞数

本文链接：https://blog.csdn.net/m0_59006402/article/details/119520688

版权

在项目中,使用for..in 一般是清空表单

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <button id="aaa">点击</button>
</body>
<script>
  let obj = {
    a: 1,
    b: 2
  }
  console.log(obj);
  document.querySelector('#aaa').onclick = function () {
    for (const key in obj) {
      obj[key] = ''
    }
    console.log(obj);
  }
</script>

</html>

对象.属性如果这个属性是个变量的话, obj[key] 这种写法就可以拿到它的值

for ... of ...的用法:

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <button id="aaa">点击</button>
</body>
<script>
  var arr = ['1', '2', '3']
  document.querySelector('#aaa').onclick = function () {
    for (const i of arr) {
      console.log('yyds', i);
    }
  }
</script>

</html>

输出的结果是:

keys可以取到每一项的下角标:

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <button id="aaa">点击</button>
</body>
<script>
  var arr = ['1', '2', '3']
  document.querySelector('#aaa').onclick = function () {
    for (const index of arr.keys()) {
      console.log('yyds', index);
    }
  }
</script>

</html>

输出结果是:

取for of 数组中的值和下标:entries()

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <button id="aaa">点击</button>
</body>
<script>
  var arr = ['1', '2', '3']
  document.querySelector('#aaa').onclick = function () {
    for (const item of arr.entries()) {
      console.log('yyds', item);
    }
  }
</script>

</html>

输出结果是:

前端~

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
for ... in ...和 for .. of ...的用法

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document&.
复制链接

扫一扫