JavaScript解构表达式

简介: JavaScript解构表达式

解构表达式可以很方便赋值

1.数组结构

<script>    
    let arr = [1, 2, 3, 4 ,5];
    //采用之前的赋值方式, 我们可以a = arr[1], b = arr[2].....  有了结构表达式就可以如下
    let [a, b, c, d, e] = arr;
    console.log(a,b,c,d,e);
</script>

2.对象结构

<script>
    const person = {
        name: 'zhanshen',
        age: 22,
        lanuage: ['python', 'java', 'go']
    }
    const {name, age, lanuage} = person;
    console.log(name,age,lanuage);
</script>

要是换名字, 可以用冒号

<script>
    const person = {
        name: 'zhanshen',
        age: 22,
        lanuage: ['python', 'java', 'go']
    }
    const {name: a, age: b, lanuage: c} = person;
    console.log(a, b, c);
</script>

3. 字符串模板

用反引号来表示长字符串

<script>
    let longStr = `
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
    `
    console.log(longStr);
</script>

用${}表示插值

<script>
    var name = '张三';
    var age = 14;
    function say() {
        return "我是个坏学生!"
    }
    console.log(`我叫${name}, 我今年${age}岁了, 明年我${age + 1}岁, 我想说${say()}`)
</script>

4. 其他方法

<script>
    let str = 'hello world';
    console.log(str.startsWith('hello'));
    console.log(str.endsWith("world"));
    console.log(str.includes("h"));
    console.log(str.includes("ll"));
</script>

目录
打赏
0
0
0
0
6
分享
相关文章
ES6解构赋值详解;全面掌握:JavaScript解构赋值的终极指南
解构赋值是一个强大且灵活的工具,它使得从数组和对象中提取数据变得更加简单和直观。通过掌握解构赋值的基本语法和实践,你可以写出更加简洁、可读性更强的代码。在实际项目中,解构赋值广泛应用于函数参数处理、变量交换、嵌套结构操作等场景,极大地提升了代码的灵活性和简洁度。 只有锻炼思维才能可持续地解决问题,只有思维才是真正值得学习和分享的核心要素。如果这篇博客能给您带来一点帮助,麻烦您点个赞支持一下,还可以收藏起来以备不时之需,有疑问和错误欢迎在评论区指出~
|
9月前
|
js---三元表达式详解
js---三元表达式详解
300 0
JavaScript基础&实战 JS中正则表达式的使用
这篇文章介绍了JavaScript中正则表达式的使用,包括正则表达式的创建、匹配模式、字符串匹配、拆分、搜索、匹配和替换等方法,并通过示例代码展示了如何应用这些技术。
JavaScript基础&实战 JS中正则表达式的使用
在js中正则表达式验证小时分钟,将输入的字符串转换为对应的小时和分钟
这篇文章介绍了如何在JavaScript中使用正则表达式来验证时间字符串的格式(小时和分钟),并提供了将时间字符串转换为JavaScript Date对象的示例代码及其测试结果。
vue中将验证表单输入框的方法写在一个js文件中(表达式验证邮箱、身份证、号码、两次输入的密码是否一致)
这篇文章介绍了如何在Vue框架中将表单输入验证逻辑封装到一个JavaScript文件中,并通过正则表达式验证邮箱、身份证、手机号等信息,同时确保两次密码输入的一致性。
JavaScript编码之路【对象的增强、ES6新特性之函数的默认值设置 、rest参数 (剩余参数)、拓展运算符、对象与数组的解构赋值】
JavaScript编码之路【对象的增强、ES6新特性之函数的默认值设置 、rest参数 (剩余参数)、拓展运算符、对象与数组的解构赋值】
112 1
JavaScript进阶-解构赋值与展开运算符
【6月更文挑战第19天】ES6的解构赋值与展开运算符增强了JS开发效率。解构允许直接从数组或对象提取值,简化数据提取,而展开运算符则用于合并数组和对象或作为函数参数。解构时注意设置默认值以处理不存在的属性,避免过度嵌套。展开运算符需区分数组与对象使用,勿混淆于剩余参数。通过示例展示了这两种操作在数组和对象中的应用,提升代码可读性与简洁度。
239 5

热门文章

最新文章

AI助理

你好,我是AI助理

可以解答问题、推荐解决方案等

登录插画

登录以查看您的控制台资源

管理云资源
状态一览
快捷访问