es6第一天笔记03——解构

news/2024/7/10 23:55:27 标签: es6

解构:把数据按照一定的方式解析进行赋值

1.字符串解构:

把字符串中的字符依次赋值给变量,如果变量比较多,会出现声明但是没有赋值的情况; 如果字符串比较多,不会报错。

<script>
    var [a, b, c, d] = 'hello';
    console.log(a, b, c, d);
</script>

控制台输出结果为:

h e l l

 2.数组解构

<script>
    var [a, b, c, d] = [1, 2, 3, 4]
    console.log(a, b, c, d);
</script>

控制台输出结果为:

1 2 3 4

3.函数的解构 

<script>
    function fn([x, y, z]) {
        console.log(x, y, z)
    }
    fn('12345')
    fn([1, 2])
</script>

 控制台输出结果为:

1 2 3
1 2 undefined

 4.对象的解构:

把对象属性的值赋值给变量,对象解构的时候,声明变量需要用{}

<script>
    let { age, user, hobby } = {
        age: 20,
        user: 'zs'
    }
    console.log(user, age, hobby);
</script>

  控制台输出结果为:

 zs 20 undefined


http://www.niftyadmin.cn/n/1367917.html

相关文章

es6第一天笔记05——数组扩展

1.声明长度为num的数组 var 数组名字 new Array(num); <script>var list new Array(10);console.log(list.length); </script> 控制台输出结果为&#xff1a; 10 2.如果数组中有多个数值&#xff0c;或者第一个元素不是数值时&#xff0c;代表着数组内部的值 …

es6第一天笔记06——函数的扩展

1.函数参数的默认值 <script>function fn(x,y20){console.log(x,y);}fn(10); </script> 控制台输出结果为&#xff1a; 10 20 2. arguments获取用户输入的所有实参&#xff0c;是一个类数组 <script>function fn(x,y){var list Array.from(arguments);lis…

vue第一天笔记01——移动端布局

<!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><meta http-equiv"X-UA-Compatible" content"IEedge"><!--视口标签 实现移动端布局&#xff0c;必须加的标签&#xff0c;禁止伸缩 --&…

vue第一天笔记14——vue练习:选项卡和发微博

一、选项卡 <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><meta http-equiv"X-UA-Compatible" content"IEedge"><meta name"viewport" content"widthdevice-width,…

vue第二天笔记01——组件的两种定义方式

一、第一种定义 <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><meta http-equiv"X-UA-Compatible" content"IEedge"><meta name"viewport" content"widthdevice-w…

vue第三天笔记04——安装node.js环境

1.打开网页&#xff1a; https://nodejs.org/en/download/ 2.下载msi文件 下载msi文件3.打开并安装 下一步勾选再下一步可以修改路径&#xff0c;不修改直接下一步直接下一步下一步安装结束4.安装 vue-cli&#xff1a; npm install vue-cli -g 安装vue命令环境5.检测是否安装…

vue第三天笔记05——使用vue-cli脚手架工具创建一个项目

1.新建文件夹&#xff0c;命名不能是中文 2.打开该文件夹&#xff0c;在该文件夹路径下输入cmd&#xff0c;进入命令行 3.输入下面的命令 vue init 模板名 项目名称(随便取名&#xff0c;要是英文) 模板名有三种&#xff1a; simple&#xff1a; 只有一个index.html文件&…

vue第三天笔记06——vue-cli练习

将下列HTML代码写入vue-cli项目 <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><meta http-equiv"X-UA-Compatible" content"IEedge"><meta name"viewport" content"…