• JavaScript数组(参考资料)


      JavaScript数组的长度和元素类型都是非固定的。因为数组的长度可随时改变,并且其数据在内存中也可以不连续,所以 JavaScript 数组不一定是密集型的,这取决于它的使用方式。
    1.Array.length
      获取或设置数组长度。
    2.Array.prototype
      通过数组的原型对象可以为所有数组对象添加属性。
    3.Array.isArray()
      检测数组。
    4.Array.prototype.push()
      追加元素到数组末尾,并返回新的数组长度。
    5.Array.prototype.pop()
      移除数组末尾元素,并返回移除的元素。
    6.Array.prototype.unshift()
      在数组首部添加元素,并返回新的数组长度。
    7.Array.prototype.shift()
      移除数组首部元素,并返回移除的元素。
    8.Array.prototype.splice()
      通过索引删除后替换元素。
    9.Array.prototype.join()
      连接所有数组元素组成一个字符串。
    10.Array.prototype.indexOf()
      在数组中查询某一元素首次出现的索引,如果未查询到该元素,返回-1。
    11.Array.prototype.lastIndexOf()
      在数组中查询某一元素最后一次出现的索引,如果未查询到该元素,返回-1。
    12.Array.prototype.includes()
      判断数组是否包含某指定的值,如果是返回 true。
    13.Array.prototype.slice(startIndex,endIndex)
      一个参数时,返回执行位置到数组末尾项组成的新数组。两个参数时,返回两个参数之间但不包括结束位置项组成的新数组,但不改变原数组。
    14.Array.prototype.reverse()
      反转数组项的顺序。
    15.Array.prototype.sort()
      无参时,会调用每一个数组项的toString()方法,然后比较字符串排序。也可接收一个比较函数作为参数,以便在比较函数里指定排序规则。
    16.Array.prototype.forEach()
      遍历数组。
    17.Array.prototype.every()
      如果数组中的每个元素都满足测试函数,则返回 true。
    18.Array.prototype.some()
      如果数组中至少有一个元素满足测试函数,则返回 true。
    19.Array.prototype.filter()
      返回满足测试函数的元素组成的数组。
    20.Array.prototype.map()
      返回每一个元素进行测试函数操作后组成的数组,不改变原数组。
    21.Array.prototype.findIndex()
      返回第一个满足测试函数的元素的索引。
    22.Array.prototype.reduce()
      该回调函数的返回值为累积结果,并且此返回值在下一次调用该回调函数时作为参数提供。

    以下为示例代码

    /* 创建数组方法:字面量,构造函数 */
    var createArray1 = [0, 1, 2, 3, 4, 5, 6];
    var createArray2 = new Array();
    
    /* 1.Array.length:获取或设置数组长度 */
    console.log(createArray1.length);//7
    
    /* 2.Array.prototype:通过数组的原型对象可以为所有数组对象添加属性。 */
    
    /* 3.Array.isArray():检测数组。 */
    console.log(Array.isArray(createArray1));//true
    
    /* 4.Array.prototype.push():追加元素到数组末尾,并返回新的数组长度。*/
    var fruitArray = ["mango"];
    var pushResult = fruitArray.push("cherry");
    console.log(fruitArray); //object:["mango", "cherry"]
    console.log(pushResult); //number:2
    
    /* 5.Array.prototype.pop():移除数组末尾元素,并返回移除的元素。 */
    var popResult = fruitArray.pop();
    console.log(fruitArray); //object:["mango"]
    console.log(popResult); //string:cherry
    
    /* 6.Array.prototype.unshift():在数组首部添加元素,并返回新的数组长度。 */
    var unshiftResult = fruitArray.unshift("apple");
    console.log(fruitArray);//object:["apple", "mango"]
    console.log(unshiftResult);//number:2
    
    /* 7.Array.prototype.shift():移除数组首部元素,并返回移除的元素。 */
    var shiftResult = fruitArray.shift();
    console.log(fruitArray);//object:["mango"]
    console.log(shiftResult);//string:apple
    
    /* 8.Array.prototype.splice():通过索引删除后替换元素。 */
    var pokers = [0, 1, 2, 3, 4, 5, 6, 7, 8];
    var spliceResulr = pokers.splice(3, 2);
    console.log(pokers);//[0, 1, 2, 5, 6, 7, 8]
    console.log(spliceResulr);//[3, 4]
    pokers.splice(3, 0, [3, 4]);
    console.log(pokers);//[0, 1, 2, 3, 4, 5, 6, 7, 8]
    
    /* 9.Array.prototype.join():连接所有数组元素组成一个字符串。 */
    console.log(['h', 'e', 'l', 'l', 'o'].join('-'));//h-e-l-l-o
    
    /* 10.Array.prototype.indexOf():在数组中查询某一元素首次出现的索引。*/
    var numbers = [7, 8, 9, 8, 7];
    var indexOfResult = numbers.indexOf(8);//number:1
    var lastIndexOfResult = numbers.lastIndexOf(8);//number:3
    
    /* 12.Array.prototype.includes():判断数组是否包含某指定的值,如果是返回 true。 */
    var includesResult = numbers.includes(8);
    console.log(includesResult);//true
    
    /* 13.Array.prototype.slice(startIndex,endIndex):一个参数时,返回执行位置到数组末尾项组成的新数组。两个参数时,返回两个参数之间但不包括结束位置项组成的新数组,但不改变原数组。*/
    var characters = ['a', 'b', 'c', 'd', 'e', 'f', 'g'];
    var copyResult1 = characters.slice(0);
    var copyResult2 = characters.slice(2, 4);
    console.log(copyResult1);//["a", "b", "c", "d", "e", "f", "g"]
    console.log(copyResult2);//["c", "d"]
    
    /* 14.Array.prototype.reverse():反转数组项的顺序。 */
    characters.reverse();
    console.log(characters);//["g", "f", "e", "d", "c", "b", "a"]
    
    /* 15.Array.prototype.sort():无参时,会调用每一个数组项的toString()方法,然后比较字符串排序。也可接收一个比较函数作为参数,以便在比较函数里指定排序规则。 */
    var noArray = [4, 8, 2, 6, 10, 12, 14];
    noArray.sort();
    console.log(noArray);//[10, 12, 14, 2, 4, 6, 8]
    noArray.sort(function (value1, value2) { return value1 - value2; });
    console.log(noArray);//[2, 4, 6, 8, 10, 12, 14] 注意null的判断,待补充,否则会报错。
    
    /* 16.Array.prototype.forEach():遍历数组。*/
    var numberArray = [11, 22, 33, 44, 55, 66, 77, 88, 99];
    numberArray.forEach(function (value, index, array) {  });
    
    /* 17.Array.prototype.every():如果数组中的每个元素都满足测试函数,则返回 true。 */
    var everyResult = numberArray.every(function (value, index, array) { return value > 55; });
    
    /* 18.Array.prototype.some():如果数组中至少有一个元素满足测试函数,则返回 true。 */
    var someResult = numberArray.some(function (value, index, array) {return value > 55;});
    /* 19.Array.prototype.filter():返回满足测试函数的元素组成的数组。*/
    var filterResult = numberArray.filter(function (value, index, array) { return value > 55;});
    
    /* 20.Array.prototype.map():返回每一个元素进行测试函数操作后组成的数组,不改变原数组。 */
    var mapResult = numberArray.map(function (value, index, array) {return value * 10;});
    
    /* 21.Array.prototype.findIndex():返回第一个满足测试函数的元素的索引。 */
    var findIndexResult = numberArray.findIndex(function (value, index, array) {return value > 55;});
    
    /* 22.Array.prototype.reduce():该回调函数的返回值为累积结果,并且此返回值在下一次调用该回调函数时作为参数提供。 */
    var reduceResult = numberArray.reduce(function (preValue, currValue, currIndex, array) {
                console.log(preValue + "-" + currValue);////11-22 22-33 33-44...88-99
                return preValue > currValue ? preValue : currValue;
            });
    console.log(reduceResult);//99
  • 相关阅读:
    vue系列【element ui table中render函数加if的使用】
    vue系列【watch的使用方法及immdiate、deep解决组件传值中数据改变视图不更新等常见问题】
    vue系列【element ui 处理图片流及实现多张图片轮播】
    webpack系列【webpack的基本使用及配置项】
    vue系列【element ui 行内三元表达式的使用及实现行内switch按钮加文字】
    vue系列【vue路由$route.go(1)返回使用KeepAlive保持原页面数据不更新】
    vue系列【post 和 get 请求书写及使用】
    vue系列【vue+element 三元表达式多条件实现功能】
    vue系列【sessionStorage的setItem和getItem使用】
    vue系列【vue swiper插件实现图片轮播效果】
  • 原文地址:https://www.cnblogs.com/yuyuefly/p/9663126.html
Copyright © 2020-2023  润新知