美文网首页
学习Javascript数据结构与算法(第2版)笔记(2)

学习Javascript数据结构与算法(第2版)笔记(2)

作者: cjrfan | 来源:发表于2018-05-30 15:24 被阅读0次

    第 2 章 数组

    1. 创建和初始化数组

    var arr = new Array();
    var arr = new Array(7);
    var arr = new Array('aa','bb');
    或:
    var arr = [];
    var arr = ['aa','bb'];
    
    arr.length  //数组长度
    

    访问元素和迭代数组

    for(var i=0;i<arr.length;i++){
        console.log(arr[i]);
    }
    

    2. 添加元素

    var arr = [1,2,3];
    arr[arr.length] = 4;
    

    2.1 使用 push 方法(添加到数组末尾)

    arr.push(5);
    arr.push(6,7);
    

    2.2 使用 unshift 方法(插入元素到数组首位)

    arr.unshift(0);
    arr.unshift(-2,-1);
    
    原理:
    for (var i=arr.length; i>=0; i--){
        arr[i] = arr[i-1];
    }
    arr[0] = 0;
    

    3. 删除元素

    3.1 使用 pop 方法(删除数组里最靠后的元素)

    arr.pop();
    

    3.2 使用 shift 方法(从数组首位删除元素)

    arr.shift();
    原理:
    for (var i = 0; i < arr.length; i++){
        arr[i] = arr[i+1];
    }
    

    4. 在任意位置添加或删除元素

    使用 splice 方法(通过指定位置/索引添加或删除相应位置和数量的元素)

    arr.splice(1,2); // 从数组索引1开始删除2个元素
    arr.splice(1,0,7,8,9); // 从数组索引1开始添加3个元素
    arr.splice(1,2,7,8,9);//从数组索引1开始删除2个元素,并从索引1开始添加3个元素
    

    5. 二维和多维数组

    function printArr(matrix){
        for(var i=0;i<matrix.length;i++){
            for(var j=0;j<matrix[i].length;j++){
                console.log(matrix[i][j])
            }
        }
    }
    
    3×3×3:
    for (var i=0; i<arr.length; i++){
        for (var j=0; j<arr[i].length; j++){
            for (var z=0; z<arr[i][j].length; z++){
                console.log(arr[i][j][z]);
            }
        }
    }
    

    6. Javascript 数组方法参考

    方法名 描述
    concat 连接2个或更多数组,并返回结果
    every 对数组中的每一项运行给定函数,如果该函数对每一项都返回 true ,则返回 true
    filter 对数组中的每一项运行给定函数,返回该函数会返回 true 的项组成的数组
    forEach 对数组中的每一项运行给定函数。这个方法没有返回值
    join 将所有的数组元素连接成一个字符串
    indexOf 返回第一个与给定参数相等的数组元素的索引,没有找到则返回-1
    lastIndexOf 返回在数组中搜索到的与给定参数相等的元素的索引里最大的值
    map 对数组中的每一项运行给定函数,返回每次函数调用的结果组成的数组
    reverse 颠倒数组中元素的顺序,原先第一个元素现在变成最后一个,同样原先的最后一个元素变成了现在的第一个
    slice 传入索引值,将数组里对应索引范围内的元素作为新数组返回
    some 对数组中的每一项运行给定函数,如果任一项返回 true ,则返回 true
    sort 按照字母顺序对数组排序,支持传入指定排序方法的函数作为参数
    toString 将数组作为字符串返回
    valueOf 和 toString 类似,将数组作为字符串返回
    6.1 数组合并 (concat)
    var num = 0;
    var arr1 = [1,2,3];
    var arr2 = [-3,-2,-1];
    var nums = arr2.concat(num,arr2);//[-3,-2,-1,0,1,2,3]
    
    6.2 迭代器函数
    var isEven = function(x){
        console.log(x)
        return (x % 2 == 0);
    };
    var nums = [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15];
    
    1. 用 every 方法迭代( every 方法会迭代数组中的每个元素,直到返回 false )
    nums.every(isEven); //1
    
    2. 用 some 方法迭代( some 方法会迭代数组的每个元素,直到函数返回 true)
    nums.some(isEven);//1,2
    
    3. 用 forEach 方法迭代(迭代整个数组,与for循环相同)
    nums.forEach(isEven);
    
    4. 使用 map 和 filter 方法
    var myMap = nums.map(isEven);// [false, true, false, true, false, true, false, true,false, true, false, true, false, true, false]
    
    var myFilter = nums.filter(isEven);//[2, 4, 6, 8, 10, 12, 14]
    
    5. 使用 reduce 方法
    nums.reduce(function(preVal,currVal,index,arr){
        return preVal + currVal;
    });//120
    
    6.3 ECMAScript 6 和数组的新功能
    方 法 描 述
    @@iterator 返回一个包含数组键值对的迭代器对象,可以通过同步调用得到数组元素的键值对
    copyWithin 复制数组中一系列元素到同一数组指定的起始位置
    entries 返回包含数组所有键值对的 @@iterator
    includes 如果数组中存在某个元素则返回 true ,否则返回 false 。ES7新增
    find 根据回调函数给定的条件从数组中查找元素,如果找到则返回该元素
    findIndex 根据回调函数给定的条件从数组中查找元素,如果找到则返回该元素在数组中的索引
    fill 用静态值填充数组
    from 根据已有数组创建一个新数组
    keys 返回包含数组所有索引的 @@iterator
    of 根据传入的参数创建一个新数组
    values 返回包含数组中所有值的 @@iterator

    ES6和ES7新增的数组方法。

    方 法 描 述
    @@iterator 返回一个包含数组键值对的迭代器对象,可以通过同步调用得到数组元素的键值对
    copyWithin 复制数组中一系列元素到同一数组指定的起始位置
    entries 返回包含数组所有键值对的 @@iterator
    includes 如果数组中存在某个元素则返回 true ,否则返回 false 。ES7新增
    find 根据回调函数给定的条件从数组中查找元素,如果找到则返回该元素
    findIndex 根据回调函数给定的条件从数组中查找元素,如果找到则返回该元素在数组中的索引
    fill 用静态值填充数组
    from 根据已有数组创建一个新数组
    keys 返回包含数组所有索引的 @@iterator
    of 根据传入的参数创建一个新数组
    values 返回包含数组中所有值的 @@iterator
    6.3.1 使用 forEach 和箭头函数迭
    nums.forEach(function(x){
       console.log(x%2==0); 
    });
    
    num.forEach(x => {console.log(x%2==0)})
    
    6.3.2 使用 for...of 循环迭代
    for(let n of nums){ //n 代表数组中每一项
        console.log((n%2==0)?'even':'odd');
    }
    
    6.3.3 使用ES6新的迭代器( @@iterator )

    ES6还为 Array 类增加了一个 @@iterator 属性,需要通过 Symbol.iterator 来访问。

    let iterator = nums[Symbol.iterator]();
    console.log(iterator.next().value); // 1
    console.log(iterator.next().value); // 2
    console.log(iterator.next().value); // 3
    console.log(iterator.next().value); // 4
    console.log(iterator.next().value); // 5
    

    数组的 entries 、 keys 和 values 方法

    1. entries 方法返回包含键值对的 @@iterator 
    let aEntries = nums.entries(); // 得到键值对的迭代器
    console.log(aEntries.next().value); // [0, 1] - 位置0的值为1
    console.log(aEntries.next().value); // [1, 2] - 位置1的值为2
    console.log(aEntries.next().value); // [2, 3] - 位置2的值为3
    
    2. keys 方法返回包含数组索引的 @@iterator
    let aKeys = nums.keys(); // 得到数组索引的迭代器
    console.log(aKeys.next()); // {value: 0, done: false }
    console.log(aKeys.next()); // {value: 1, done: false }
    console.log(aKeys.next()); // {value: 2, done: false }
    
    3. values 方法返回的 @@iterator 则包含数组的值
    let aValues = nums.values();
    console.log(aValues.next()); // {value: 1, done: false }
    console.log(aValues.next()); // {value: 2, done: false }
    console.log(aValues.next()); // {value: 3, done: false }
    
    6.3.4 使用 from 方法(根据已有的数组创建一个新数组)
    let nums2 = Array.from(nums);
    
    let evens = Array.from(nums,x => {x%2==0});
    
    6.3.5 使用 Array.of 方法(根据传入的参数创建一个新数组)
    let num3 = Array.of(1);
    let num4 = Array.of(1, 2, 3, 4, 5, 6);
    等价于:
    let num3 = [1];
    let num4 = [1, 2, 3, 4, 5, 6];
    
    复制已有数组:
    let numCopy = Array.of(...num4);
    
    6.3.6 使用 fill 方法(用静态值填充数组。参数:填充数、开始索引、结束索引)
    let numCopy = Array.of(1, 2, 3, 4, 5, 6);
    
    numCopy.fill(0); // [0,0,0,0,0,0]
    numCopy.fill(2, 1); // [0,2,2,2,2,2]
    numCopy.fill(1, 3, 5); // [0,2,2,1,1,2]
    let ones = Array(6).fill(1);// [1,1,1,1,1,1]
    
    6.3.7 使用 copyWithin 方法(复制数组中的一系列元素到同一数组指定的起始位置)
    let copyArray = [1, 2, 3, 4, 5, 6];
    copyArray.copyWithin(0, 3); // [4, 5, 6, 4, 5, 6]
    
    copyArray = [1, 2, 3, 4, 5, 6];
    copyArray.copyWithin(1, 3, 5);// [1, 4, 5, 4, 5, 6]
    
    6.4 排序元素
    nums = [1,2,3,4,5,6,7,8,9,10]
    nums.reverse();//[10,9,8,7,6,5,4,3,2,1]
    nums.sort(function(a, b){
        return a-b;
    });
    等价于:
    function compare(a, b) {
        if (a < b) {
            return -1;
        }
        if (a > b) {
            return 1;
        }
        return 0;
    }
    nums.sort(compare);
    
    6.4.1 自定义排序
    var friends = [
        {name:'张三',age:18},
        {name:'李四',age:25},
        {name:'王五',age:21}
    ]
    function comparePerson(a, b){
        if (a.age < b.age){
            return -1
        }
        if (a.age > b.age){
            return 1
        }
        return 0;
    }
    console.log(friends.sort(comparePerson));//从小到大
    
    6.4.2 字符串排序
    var names =['Ana', 'ana', 'john', 'John'];
    names.sort(function(a, b){
        if (a.toLowerCase() < b.toLowerCase()){
            return -1
        }
        if (a.toLowerCase() > b.toLowerCase()){
            return 1
        }
        return 0;
    });
    
    对带有重音符号的字符做排序
    var names2 = ['Maève', 'Maeve'];
    console.log(names2.sort(function(a, b){
        return a.localCompare(b);
    }));
    
    6.5 搜索

    indexOf 方法返回与参数匹配的第一个元素的索引, lastIndexOf 返回
    与参数匹配的最后一个元素的索引

    6.5.1 ECMAScript 6—— find 和 findIndex 方法
    let nums = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15];
    function multipleOf13(element, index, array) {
        return (element % 13 == 0) ? true : false;
    }
    console.log(nums.find(multipleOf13)); //找到返回13,找不到返回undefined
    console.log(nums.findIndex(multipleOf13)); //找到返回索引,找不到返回-1
    
    6.5.2 ECMAScript 7——使用 includes 方法
    数组里存在某个元素, includes 方法会返回 true ,否则返回 false 。
    console.log(nums.includes(15));
    console.log(nums.includes(20));
    
    let nums2 = [7, 6, 5, 4, 3, 2, 1];
    console.log(nums2.includes(4, 5));//从索引5开始查找
    
    6.6 输出数组为字符串
    把数组里所有元素输出为一个字符串,可以用 toString 方法
    console.log(nums.toString());
    
    用一个不同的分隔符(比如 - )把元素隔开,可以用 join 方法
    var numsString = nums.join('-');
    console.log(numsString);
    
    6.7 类型数组
    类型数组 数据类型
    Int8Array 8位二进制补码整数
    Uint8Array 8位无符号整数
    Uint8ClampedArray 8位无符号整数
    Int16Array 16位二进制补码整数
    Uint16Array 16位无符号整数
    Int32Array 32位二进制补码整数
    Uint32Array 32位无符号整数
    Float32Array 32位IEEE浮点数
    Float64Array 64位IEEE浮点数

    类型数组则用于存储单一类型的数据

    类型数组 数据类型
    Int8Array 8位二进制补码整数
    Uint8Array 8位无符号整数
    Uint8ClampedArray 8位无符号整数
    Int16Array 16位二进制补码整数
    Uint16Array 16位无符号整数
    Int32Array 32位二进制补码整数
    Uint32Array 32位无符号整数
    Float32Array 32位IEEE浮点数
    Float64Array 64位IEEE浮点数
    let length = 5;
    let int16 = new Int16Array(length);
    let array16 = [];
    array16.length = length;
    for (let i=0; i<length; i++){
        int16[i] = i+1;
    }
    console.log(int16);
    

    相关文章

      网友评论

          本文标题:学习Javascript数据结构与算法(第2版)笔记(2)

          本文链接:https://www.haomeiwen.com/subject/sctxsftx.html