资讯专栏INFORMATION COLUMN

learning javascript - 数组

zzir / 2083人阅读

摘要:过滤掉等于的数组元素返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值数组元素平方用于检测数组中的元素是否满足指定条件如果有一个元素满足条件,则表达式返回剩余的元素不会再执行检测如果没有满足条件的元素,则返回。

数组常用方法

创建数组

var fruits = ["Apple", "Banana"];

console.log(fruits.length);

通过索引访问数组元素

var first = fruits[0]; // Apple

遍历数组

for(var i = fruits.length-1;i >=0 ; i--){
     console.log(fruits[i]);
}

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

fruits.forEach(function (item, index, array) {
    console.log(item, index);
});

添加元素到数组的末尾

var newLength = fruits.push("Orange"); // ["Apple", "Banana", "Orange"]

删除数组末尾的元素

var last = fruits.pop(); // remove Orange (from the end) 
// ["Apple", "Banana"];

删除数组最前面(头部)的元素

var first = fruits.shift(); // remove Apple from the front
// ["Banana"];

添加元素到数组的头部

var newLength = fruits.unshift("Strawberry") // add to the front
// ["Strawberry", "Banana"];

找出某个元素在数组中的索引

indexOf 该方法用来检索某项数组出现的位置,出现多次的话只记录第一次出现的位置

var index = fruits.indexOf("Banana"); // 1

通过索引删除某个元素

var removedItem = fruits.splice(pos, 1); // this is how to remove an item

// ["Strawberry", "Mango"]

从一个索引位置删除多个元素

会改变原数组

var vegetables = ["Cabbage", "Turnip", "Radish", "Carrot"];
var pos = 1, n = 2;
var removedItems = vegetables.splice(pos, n);

console.log(vegetables); // ["Cabbage", "Carrot"] 
console.log(removedItems);  // ["Turnip", "Radish"]

复制一个数组

从某个已有的数组返回选定的元素。可理解为数组截取,可接受两个参数,只填一个参数表示从该位置起截取至最后,填两个参数表示要截取的头和尾的位置

var shallowCopy = fruits.slice();
console.log(fruits["2"] == fruits["02"]); // true

fruits[5] = "mango";
console.log(Object.keys(fruits));  // ["0", "1", "2", "5"]
console.log(fruits.length); // 6

JavaScript 解释器通过调用 toString 隐式转换成字符串

Array.length 属性会根据数组的内置方法调整改变

数组方法

Array.from() 从类数组对象或者可迭代对象中创建一个新的数组实例。

Array.isArray() 用来判断某个变量是否是一个数组对象。

Array.of() 根据一组参数来创建新的数组实例,支持任意的参数数量和类型。

实例方法

所有数组实例都会从 Array.prototype 继承属性和方法。修改 Array 的原型会影响到所有的数组实例。

concat()

连接两个或更多的数组,并返回结果

var arr = [ 1, 2, 3 ];
var arr2= arr.concat("4", "5", "6");   //["1", "2", "3", "4", "5", "6"];

join()

把数组的所有元素放入一个字符串并通过指定的分隔符进行分隔

arr.join("+");   //"1+2+3";

reverse()

反转数组中元素的顺序。

arr.reverse(); 
console.log(arr);   // [3, 2, 1];

sort()

数组排序 按照字符串的方式来排序。

toString()

把数组转换为字符串,并返回结果

filter()

创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素。

//过滤掉等于 2 的数组元素:
function isBigEnough(element, index, array) {
    return (element == 2);
}

arr.filter(isBigEnough)   //2

map()

返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值

//数组元素平方:
function two(x) {
    return x*x;
}
console.log(arr.map(two))

some()

用于检测数组中的元素是否满足指定条件,如果有一个元素满足条件,则表达式返回true, 剩余的元素不会再执行检测,如果没有满足条件的元素,则返回false。

function whoBig(element, index, array) {
    return (element >= 100);
}

arr.some(whoBig)   //false

every()

用于检测数组所有元素是否都符合指定条件,如果数组中检测到有一个元素不满足,则整个表达式返回false,且剩余的元素不会再进行检测。

function whoBig(element, index, array) {
    return (element >= 4);
}

arr.every(whoBig)   //false

find()

返回传入一个测试条件,符合条件的数组第一个元素,当数组中的元素在测试条件时返回true时, find() 返回符合条件的元素,之后的值不会再调用执行函数。如果没有符合条件的元素返回 undefined

const pets = [
  { type: "Dog", name: "Max"},
  { type: "Cat", name: "Karl"},
  { type: "Dog", name: "Tommy"},
];

var pet = pets.find(pet => pet.type ==="Dog" && pet.name === "Tommy");
console.log(pet); // { type: "Dog", name: "Tommy" }

reduce()

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

var arr = [1,2,3];
var sum = arr.reduce(function(prev, cur, index, arr) {
    console.log(prev, cur, index);
    return prev + cur;
})

console.log(arr, sum); 

数组去重

function unique(arr) {
    var result = [];
    for (var i = arr.length - 1; i >= 0; i--) {
        if(result.indexOf(arr[i])==-1){
            result.push(arr[i]);
        }
    }
    return result;
}
var arr = [1,2,3,4,5,2,2,2,"test","king","test"];
console.log(unique(arr));

function unique1(arr){
    var obj = {},result = [];
    for (var i = arr.length - 1; i >= 0; i--) {
        if(!obj[arr[i]]){
             obj[arr[i]] = true;
             result.push(arr[i]);
        }
    }
    return result;
}
console.log(unique1(arr));

function unique2(arr){
    arr.sort();
    var result =[];
    for (var i = arr.length - 1; i >= 0; i--) {
        if(arr[i]!=result[result.length-1]){
            result.push(arr[i]);
        }
    }
    return result;

}

console.log(unique2(arr));

function unique3(a) {
  return Array.from(new Set(a));
}

感谢

https://juejin.im/post/5a8663...

https://developer.mozilla.org...

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/92979.html

相关文章

  • 5分钟了解JSON那些事儿

    摘要:简介是对象表示法的缩写是一种数据格式而不是一种编程语言用来表示结构化数据是的一个严格子集并不从属于很多编程语言都可以用数据格式语法语法可以表示以下三种类型的值简单值字符串数值布尔值但是不支持对象数组不支持变量函数对象实例简单值字符串数字布尔 JSON 简介 JSON是JavaScript Object Notation(JavaScript对象表示法)的缩写 JSON是一种数据格式,...

    ad6623 评论0 收藏0
  • learning javascript - 继承

    摘要:让子的原型链指向父的实例父实例化的对象让父的属性创建在子的上把的方法应用到这个对象身上传递一个数组或,而就要一个个地传过案例中的继承在中实现继承等价于 继承 call实现继承 用于实现函数继承,call的第二个参数可以是任意类型 function Animal(){ this.name = ; this.say = function(){ console...

    inapt 评论0 收藏0
  • JavaScript机器学习之线性回归

    摘要:不能用于机器学习太慢幻觉矩阵操作太难有函数库啊,比如只能用于前端开发开发者笑了机器学习库都是开发者机器学习库神经网络神经网络自然语言处理卷积神经网络一系列库神经网络深度学习我们将使用来实现线性回归,源代码在仓库。 译者按: AI时代,不会机器学习的JavaScript开发者不是好的前端工程师。 原文: Machine Learning with JavaScript : Part 1 ...

    gitmilk 评论0 收藏0
  • Vue.js源码(2):初探List Rendering

    摘要:最后举两个例子,回顾上面的内容例一改变的是数组元素中属性,由于创建的的指令,因此这里直接由指令更新对应元素的内容。 下面例子来自官网,虽然看上去就比Hello World多了一个v-for,但是内部多了好多的处理过程。但是这就是框架,只给你留下最美妙的东西,让生活变得简单。 {{ todo.text }} ...

    shiyang6017 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<