一、循环常用的5种形式

1.1、while循环

const arr =[10,admin,true]console.log(arr.length)console.table(arr)// (1)初始化：入口let index =0// (2)条件：index < arr.lengthwhile(index < arr.length){ console.log(arr[index])// (3)更新条件：避免死循环 index++}

1.2、for循环

for: while的语法糖，将三要素全部整合到参数列表中

for (初始化；条件；更新条件) {} console.log(fo项目搭建网点我wcqh.cnr循环:)for(let index =0; index < arr.length; index++){ console.log(arr[index])}

1.3、for-of循环

console.log(for-of循环:)for(let value of arr){// 1.value = arr[0], 输出 value// 2.value = arr[1], 输出 value// 3.value = arr[2], 输出 value// 4.value = arr[3], false/end// value：循环变量，用户接收每一次的要被遍历的值 console.log(value)}

1.4、for-i项目搭建网点我wcqh.cnn循环：遍历“对象”

console.log(for-in循环:)const obj ={ id:100,my name:电脑, price:9000}for(let key in obj){//console.log(key, obj[key]) console.log(`${key}=> ${obj[key]}`)}

1.5、forEach/map循环

1.5.1、说明

// 这是定义在数组对象上的接口// 接口：函数或方法// forEach,map：参数相同，仅仅是返回值不同// forEach无返回值，map无返回值// forEach(回调函数)// array.forEach(function(va项目搭建网点我wcqh.cnlue, index, array){}) /*console.log(forEach循环:)arr.forEach(function(item,index,arr) { console.log(item,index,arr)})*/// 通常只关注第一个参数，当前的值arr.forEach(function(item){ console.log(item)})// 简化：console.log(简化:)arr.forEach(item => console.log(item))

1.5.2、forEach()无返回值，map()有返回值

// arr.forEach()：无返回值let res = arr.f项目搭建网点我wcqh.cnorEach(item => item)console.log(res)// arr.map()：有返回值res = arr.map(item => item)console.log(res)

1.5.3、小实战

//小实战：console.log(小实战:)res = arr.map(item =>`<li>${item}</li>\n`).join()//res = `<ul>\n` + res + `</ul>`res =`<ul>\n${res}</ul>`console.log(res)

二、数组与对象的解构赋值

2.1、数组

// 语法// 左边：模板，数组用[…]，对象用 {…}// 右边：值（数组，项目搭建网点我wcqh.cn对象）// 1. 数组// 创建，声明let [uname, email]=[西门,xm@php.com]// 在 [], {}, ()之前的分号不能省// 更新;[uname,email]=[金莲,jl@php.com]console.log(uname, email)// 变量 > 值：默认值;[uname,email, gender=女]=[金莲,jl@php.com]console.log(uname, email, gender)// 变量 < 值：剩余参数 …rest;[uname,email,…arr]=[武大,wd@php.com,男,60]let[sex,age]= arrcons项目搭建网点我wcqh.cnole.log(uname, email, sex, age)

2.2、对象

// 2. 对象解构// 默认变量名和属性相同// let { id, username } = { id:1, username:wcqh.cn }// 变量与当前作用域中的变量命名冲突时，可以用别名访问let { id, uname: username }={ id:1, uname:wcqh.cn}console.log(id, username)

2.3、应用1

// 应用场景1：克隆对象let user ={ uname:admin, email:admin@wcqh.cn}console.log(user)//克隆let {…obj}=user项目搭建网点我wcqh.cnconsole.log(obj)console.log(obj===user)// 结果false, obj就是user的克隆

2.4、应用2

// 2. 应用场景2：解构传参let show =function(user){return`${user.uname} ${user.email}`}user ={ uname:guest, email:guest@wcqh.cn}console.log(show(user))//使用对象解构来简化传参show =function({ uname, email }){//return `${user.uname} ${user.email}`return`${uname}项目搭建网点我wcqh.cn ${email}`}console.log(show(user))