• 对象的解构赋值


    对象的解构赋值中,与顺序无关,需要注意的是,变量名与属性名必须一致
    const {name} = obj;这一步是数据解构赋值,相当于声明了保存在obj中的name属性值,意思是可以通过obj访问到name属性,因此还可以打印到name。
    对象与数组不同,对象是无序的。所以它是通过属性名来标志的,不需要逗号分开:
    用const进行对象的解构赋值时,遇到同名的键值对可以这样重新命名:
    {skillName:sklName},意思是取该对象的skillName的属性并赋值给sklName

    1、对象的解构赋值

    //对象的解构赋值
                const obj = {
                    saber :'阿尔托利亚',
                    archer:'卫宫'
                };
                const {saber, archer1 } = obj;

    2、稍微复杂的解构条件

    //稍微复杂的解构条件
                
                const player = {
                    nickname:'感情的戏我没演技',
                    master:'东海龙王',
                    skill: [{
                        skillName:'龙吟',
                        mp:'100',
                        time:6000
                    },{
                        skillName:'龙卷雨击',
                        mp:'400',
                        time:3000
                    },{
                        skillName:'龙腾',
                        mp:'900',
                        time:60000
                    }]
                };
                const { nickname } = player; //梦幻西游
                const { master } = player; //东海龙王
                const { skill:[ skill1, { skillName }, { skillName : sklName} ] } = player;
                
                const { skill } = player;//得到数组龙吟龙腾龙卷

    const [ skill1 ] = skill;//得到数组第一项龙吟
    
    
    
    
    

    3、结合扩展运算符,

    通过扩展运算符“...”来获取obj中的属性和属性值是可以的:扩展运算符有一个作用就是取出参数对象中的所有可遍历属性,拷贝到当前对象之中,就是通过“...”可以拿到obj中的键值对拷贝到a上。
    //结合扩展运算符
                const obj = {
                    saber:'阿尔托利亚',
                    archer:'卫宫',
                    lancer:'瑟坦达'
                };
                const { saber, ...oth } = obj;
                
                对象的合并
                const obj1 = {
                    archer:'卫宫',
                    lancer:'瑟坦达'
                }
                const obj = {
                    saber:'阿尔托利亚',
                    ...obj1
                }
    //oth得到后两项组合的一个对象(即剩下的所有没有匹配到的内容)
    
    
     
    
    

    4、如何对已经申明的变量进行解构赋值(不建议这种写法)

    //如何对已经申明来的变量进行解构赋值(不建议这种写法)
                let age;
                const obj = {
                    name:'小明',
                    age:22
                };
                ( { age } = obj );
                //
    //得到age的值22
    
    

    5、默认值(在对象传入乱序的排序参数时会经常使用)

    
    
                //默认值
                let girlfriend = {
                    name:'小红',
                    age:22,
                };
                let { name, age = 24, hobby = ['学习']} = girlfriend
                

    6、提取对象属性

                //提取对象属性
                const { name, hobby: [ hobby1 ] , hobby } = {
                    name: '小红',
                    hobby: ['学习']
                };
                

    6、使用对象传入乱序的函数参数

                //使用对象传入乱序的函数参数
                function AJAX({
                    url,
                    data,
                    type = 'get'
                }){
                    console.log(type);
                };
                
                AJAX({
                    
                    data:{
                        a:1
                    },
                    url:'/getinfo',
                });
                

    7、获取多个函数的返回值

                //获取多个 函数返回值
                function getUserInfo(uid){
                    //..AJAX
                    return{
                        status:true,
                        data:{
                            name:'小红'
                        },
                        msg:'请求成功'
                    };
                };
                
                const{ status, data, msg:message } = getUserInfo(123);
                 
                
  • 相关阅读:
    redis的坑
    引入easyui的404问题
    添加 @ResponseBody出现错误的问题
    星期,时间
    activiti的坑
    使用shiro遇到的问题
    IS应用程序池的查看与配置【转载】
    JS判断值是否是数字
    如何在EJS中将变量呈现为HTML?
    My97DatePicker日期控件的下载及使用方法
  • 原文地址:https://www.cnblogs.com/rickdiculous/p/13122205.html
Copyright © 2020-2023  润新知