第五章 数组---字符串

1、二维数组

二维数组 数组里面套数组

        var arr = [[1,2],[3,4]];
        console.log(arr[0][1])
        console.log(arr[1][0])

2、数组的方法

/ 增,删,改,查 /

增加方法

增加->push 特点：

                      1、可以添加一个值，也可以添加多个值<br />                          2、不能去拼接数组<br />                          3、向后添加

        var arr = [1,2,3,4]; //[1,2,3,4,5,6,7]
        var b = [5,6,7,8];
        arr.push(b);
        console.log(arr);

增加->unshift 特点：

                           1、向前添加

        var arr = [1,2,3,4];
        arr.unshift(0);
        console.log(arr);

展开

…arr 可以将一个数组展开

        var arr = [1,2,3];
        console.log(arr);
        console.log(...arr);
        var a = [4,5,6];
        var b = [7,8,9];
        a.push(...b);
        console.log(a);

concat()方法

用于连接两个或多个字符串

        /* concat 不能改变数组结构*/
        var arr = [1,2,3];
        var c = [ 5,6,7]
        var b = arr.concat(c);
        console.log(arr);
        console.log(b);

删除方法

pop —从末尾删除 shift —从前面删除

        var arr = [1,2,3,4];
        arr.pop();
        arr.shift();
        console.log(arr)

定点删除

    splice(index,howmany)<br />        index  从哪个下标开始<br />        howmany  删除多少个

        var arr = [1,2,3,4,5]; //[1,2,3,5];
        arr.splice(3,1);
        console.log(arr);

修改方法

修改splice(index,howmany,value);
index 从哪个下标开始
howmany 删除多少个
value 插入的值(可以是多个值)

        var arr = [1,2,3,4,5];  //[1,2,7,4,5]
        // arr[2] = 7;
        arr.splice(2,1,7);
        console.log(arr);

查询

indexOf —查询数组某个值的下标
slice(startIndex,endIndex) 不包含endIndex
slice(startIndex) 截取从startIndex开始到后面所有的值

        var arr = [1,2,3,4];
        console.log(arr.indexOf(4));
        console.log(arr.slice(1,3))
        console.log(arr.slice(1))

join()方法

将数组拼接成字符串

        var arr = ["html","css","javascript"];
        console.log(arr.join());
        console.log(arr.join(""))
        console.log(arr.join("|"))
        console.log(arr.join(" "))

    <p id="p"></p>
    <script>
        var p =  document.getElementById("p");
        var arr = [1994,"犯罪","剧情"];  //  1994 / 美国 / 犯罪 剧情
        var str = arr.join("/");
        p.innerHTML =  str;
        console.log(str);
    </script>

        var data  = {
            country:"美国",
            year:1994,
            story:"犯罪"
        }
        /* 美国/1994/犯罪 */
        var  arr = []
        for(var i in data){
            arr.push(data[i])
        }
        var str = arr.join("/");
        console.log(str);

3、升序降序

升序算法

        var arr = [4,7,1,3,14];
        arr.sort((a,b)=>{
            return a-b;
        })
        console.log(res)

降序算法

        var arr = [4,7,1,3,14];
        arr.sort((a,b)=>{
            return b-a
        })
        console.log(res)

例子1：根据年龄升序

        var students = [
            {name:"zhang",age:20},
            {name:"li",age:18},
            {name:"wang",age:9},
            {name:"chen",age:14},
        ]
                 var result = students.sort((a,b)=>{
             return a["age"]-b["age"]
         })
         console.log(result)

例子2：通过好评数排序

    <button id="like">通过好评数排序</button>
    <button id="price">通过价格排序</button>
    <script>
        var like = document.getElementById("like");
        var sales = [
            { name: "张三", like: 60, distance: 1000, price: 10 },
            { name: "张三", like: 30, distance: 100, price: 40 },
            { name: "张三", like: 20, distance: 500, price: 6 },
        ]
        /* 升序 */
        function addOrder(arr, value) {
            if (Array.isArray(arr)) {
                var res = arr.sort((a, b) => {
                    return a[value] - b[value];
                })
                return res;
            }else{
                return null;
            }
        }
        like.onclick = function () {
            console.log(addOrder(sales, "like"))
        }
        price.onclick = function () {
            console.log(addOrder(sales, "price"))
        }
    </script>

求和

        var arr = [1,2,3,4];
        var sum = 0;
        for(var i=0;i<arr.length;i++){
            sum =sum+ arr[i];
        }
        //sum=1
        //sum=1+2;
        //sum =3+3;
        //sum =6+4
        console.log(sum)

reduce() 方法

接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值。

        var arr = [1,2,3,4];
        var sum =  arr.reduce((a,b)=>{
            return a+b;
        })
        console.log(sum)
        console.log(arr);

取最大和最小值

Math.max(…arr) 对数组取最大值
Math.min(…arr) 对数组取最小值

        var arr = [1,2,3];
        console.log(Math.max(12,1,2));
        console.log(Math.max(...arr));

数组的遍历

        var arr = [2,3,4,5];
        // forEach
        /* 
        1.对数组执行遍历
         */
        arr.forEach((item,index)=>{
            console.log(item+"--"+index)
            item+=2;
        })

map 可以改变数组每一个项,得到一个新的值

例子1：

        /* for-of  for in */
        var arr = [1,2,3];
        for(var i of arr){
            // console.log(i)
        }
        var res = arr.map(item=>{
           return item*2
        })
        console.log(arr);
        console.log(res);

例子2：

        var arr = [
            {name:"html",value:"12px"},
            {name:"css",value:"13px"},
            {name:"vue",value:"11px"},
        ]
        /* 
        var res = [
            {name:"html",value:24},
            {name:"css",value:26},
            {name:"vue",value:22},
        ]
         */
        arr.map(item=>{
            var value = parseInt(item["value"])*2;
            return item["value"] = value;
        })
        console.log(arr);

例子3：

        var arr = [1,2,3];
        /* 
        1.数组的每一项是基础(简单)类型,执行map不会改变数组原来的结构
        2.数组的每一项是复杂类型{object},那么执行map方法会改变原来的数据结构
         */
        var res = arr.map(item=>{
            return item*3;
        })
        console.log(arr);
        console.log(res);
        var obj = [{name:"li",age:10},{age:"zhang",age:11}];
        var result  = obj.map(item=>{
            return item.age = 0;
        })
        console.log(result);
        console.log(obj)

for in

        var arr = [
            {name:"html",value:"12px"},
            {name:"css",value:"13px"},
            {name:"vue",value:"11px"},
        ]
        var res = []
        for( var key in arr){
            arr[key].value = parseInt(arr[key].value)*2;
            res.push(arr[key]);
        }
        console.log(res);

// some 返回boolean 只有数组中一项满足条件,就输出true
//every 返回boolean 只有数组中m每一项满足某个条件,就输出true

        var arr = [1,2,3,4];
        var res = arr.some(item=>{
            return item>2;
        })
        var b = arr.every(item=>item>2);
        console.log(res)
        console.log(b);

其他