解构赋值

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

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>解构赋值</title>
</head>

<body>
</body>
<script>
  // let arr = [10, 20, 30, 40];
  // let [a, b, c, d] = [...arr];
  // console.log(a, b, c, d)
  let arr = [10, 20, 30, 40];
  // 放回一个新数组
  let [a, ...b] = [...arr];
  console.log(a, b)
</script>

</html>
 
2.
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>解构赋值</title>
</head>

<body>

</body>
<script>
  let data = [{
    id: 1,
    name: 'zxw'
  }, {
    id: 2,
    name: 'xpx'
  }]
  let str = ''
  data.map(item => {
    let { id, name } = item || {};
    str += `<div>
    <span>${id}</span>
    <span>${name}</span>
    </div>`
  })
  console.log(str)
  // < div >
  //     <span>1</span>
  //     <span>zxw</span>
  //   </ > <div>
  //     <span>2</span>
  //     <span>xpx</span>
  //   </div>
</script>

</html>
 
原文地址:https://www.cnblogs.com/guangzhou11/p/12772025.html