es6中的array数据和object对象

2020-11-26  本文已影响0人  工程师54

     vue开发中常用到数组型变量和对象型变量,稍有不慎就会导致简单问题复杂化,但如果用好的话则将很多复杂问题简单化。笔者相关使用心得总结如下:

    1、定义

       数组型变量定义:    aa:[]

        对象型变量定义:    bb:{}

      2、赋值

        数组型变量赋值:  aa.push(值) ;

        对象型变量赋值:bb.属性1=值1 ;   bb.属性2=值2 ; ......

       3、基本应用

         数组型变量基本引用:一般使用for(let i =0 ; i < aa.length ; i++){  let x = aa[i] ; ......  }

          对象型变量基本应用:一般使用引用属性,let x= bb.属性1 ; 

        4、混合应用

          实际项目中用的比较多的场景还是混合应用,例如:

           1)从后台数据库中获取结合集合保存到对象bb中

            2)将对象bb依次插入到数组aa中,一般有如下两种方式:

                  方式一:aa.push(bb);

                   方式二:aa.push({

                                              属性1: 值1,

                                               属性2:值2,

                                                ....});

                5、动态数据的展现*

      如果要在<template>的html中动态展现数据,则一般采用{{bb.属性1}},这要求在定义对象型bb时就要将属性描述全,如:bb{属性1:'',属性2:'',属性3:'',...},如果使用到没有定义的属性,则会报错。因此如果属性的名称和数量如果是动态生成的,则就不能采用这种方式。此时一般采用混合应用方式,在<template>的html中应用时,采用如下方式:

<template v-for="(ff) in aa">

    <table><tr><td>{{ff.属性1}}</td></tr></table>

</template>

              总结:在对象的属性数量未知、对象的数量未知情况下,采用混合式应用时很容易出错,这就要求按照以上规则合理定义数组型变量和对象型变量。

上一篇 下一篇

猜你喜欢

热点阅读