VUE前端基础(一)-------数组与迭代(循环)

迭代（循环）主要是以下几种方式：

一、传统迭代

注：以下的例子均以第一个实例中的数组为例子。

 /* 中括号为索引值，后端经常称之为下标，从0开始 */
            ar[0] = 'helloword'
            ar[1] = 100
            ar[2] = true
            ar[3] = null

            /* 
                传统迭代 
                Java:
                    String         length()
                    Array          length
                    List           size()

                Js:
                    length
            */
            for(let i = 0;i<ar.length;i++){
                console.log(`传统迭代${ar[i]}`)
            }

二、for in循环

  /* 
                ES5 for in循环
                for(let key in 循环体){

                }
                
                key:如果是单值集合，则迭代的就是每个元素的索引值
                如果是多值集合，则迭代的是属性等
                let可以省略
            */
            for(let key in ar){
                console.log(`forin循环${ar[key]}`)
            }

三、for of 循环

/* 
                ES6 for of 循环
                不能迭代自己创建的对象
                
                for(let value of 循环体){
                    value就表示被迭代的循环体中的数据
                }

                let可以省略
            */
            for(let value of ar){
                console.log(`forof循环${value}`)
            }

四、foreach()方法以及箭头函数

箭头函数相当于简写版的foreach()方法

/* 
                foreach()方法
                ar.forEach(function(alias,index){

                })  
                alias:每个被遍历的数据
                index:索引（不是必须）
                
            */
            ar.forEach(function(a,index){
                console.log(`索引是${index}的元素是${a}`)
            })

            /* 
                ES6箭头函数
                    在ES6中添加了箭头函数的书写方式，大大简化了脚本的书写
                    如果出现匿名函数，则可以使用箭头函数
                    省略function在参数之后添加 =>
                    如果只有一个参数则小括号可以省略，如果没有参数或者一个以上
                    则小括号不能省略
                    函数体如果直接是return语句，则return省略 大括号省略
            */
            ar.forEach( a => {
                console.log(`元素是${a}`)
            })

数组：

数组的添加和删除

            /* 
                向数组中添加元素 
                数组.push(要添加的元素)
                注意 如果使用const来赋值，则数据是常量，不能随意更改，
                但这仅仅是针对基本数据类型，如果是复合数据类型，则
                常量内存地址已经划分完毕，可以进行随意的增减操作，由于内存划分完毕
                所以不会引起内存的频繁分配反而非常稳定，所以在赋值对象和数组时
                优先推荐使用const
            */
            datas.push(7)
            /* 
                向数组中删除元素
                数组.splice(被删除的元素索引,删除个数)
            */
            datas.splice(0,1)