javascript数组详解(js数组深度解析)

Array 对象是一个复合类型,用于在单个的变量中存储多个值,每个值类型可以不同。

创建数组对象的方法:

new Array();
new Array(size);
new Array(element0, element1, ..., elementn);
1.  当索引值为负数时,会将其看作是对象的一个属性,若为非负的数字字符串,则会隐式转换为数字索引:
      var a= new Array();
      a[-1.23]=true;
      a[1]="pomelo";
      a["100"]="tt";
      console.log(a);   ///  [1: "pomelo", 100: "tt", -1.23: true]
      console.log(a.length)   /// 101  稀疏数组的长度为最大下标+1

其实数组对象的索引其实就是对象属性名的一种特殊形式,当试图查询任何对象属性名时,不会报错,而会显示undefined:

console.log(a["hello"]);   //undefined

2.  length属性可以用于置空数组或从前向后截取数组:

    var array1=[1,2,3,4,5];
    array1.length=3;   ///[1,2,3]
    array1.length=0;   ///[]
    array1.length=5;   ///[] 长度为5的空数组
    console.log(array1)

可以使用Object.defineProperty(对象,属性名,{设置})方法设置可读可写:

    Object.defineProperty(array1,"length",{writable:false});
    array1.length=10;
    console.log(array1.length);    ///5

3.数组元素的添加和删除:

末尾:添加元素push(),删除元素pop();

首部:添加元素unshift(),删除元素shift();

    var array2=[1,2,3,4,5];
    array2.unshift(6);   ///[6,1,2,3,4,5]
    array2.shift();   //[1,2,3,4,5]
    console.log(array2);

4.数组的便利优化与筛选

当数组容量很大时,length不应在每次循环中都查询;

当需要过滤数组中的无效数据时,用continue跳出本次循环;

var array3=[null,1,0,undefined];for(var i= 0,len=array3.length;i<len;i++){    if(!array3[i]) continue;    console.log(array3[i]);   //1}

或者利用ES5自带的foreach()方法:

    var array4=[1,2,3,4];
    var sum=0;
    array4.forEach(function(i){
        sum+=i;
    });
    console.log(sum);   ///10

5.js不支持多维数组,但可以通过数组的数组来实现:

    var array5=new Array(10);
    for(var i=0;i<array5.length;i++){
        array5[i]=new Array(10);
    }
    for(var i=0;i<array5.length;i++){
        for(var j=0;j<array5[i].length;j++){
            array5[i][j]=i*j;
        }
    }
    console.log(array5[5][6]);   //30

6.数组方法

6.1   join()  将数组转化为字符串并连接在一起

    var array6=[1,2,3];
    console.log(array6.join("-"));  // 1*2*3
    console.log(array6.join(""));  // 123
    console.log(array6.join());  // 1,2,3
    console.log(typeof array6.join());  // String

6.2   reverse() 在原数组本身基础上将元素顺序颠倒

var array7=[1,2,3];console.log(array7.reverse())  //[3,2,1]

6.3  sort() 数组排序

      var array8=["apple","cherry","cherry"];
      console.log(array8.sort());    //["apple", "cherry", "cherry"]
      array8.push(undefined);
      console.log(array8.sort());   //undefined会被放到最后 ["apple", "cherry", "cherry", undefined]

若想改变排序规则,需要传入一个比较函数:

    var array9=[33,4,11,222];
    console.log(array9.sort());   //11,222,33,4   默认以第一个数字比较
    console.log(array9.sort(function(a,b){             //从小到大排列
        return a-b;
    }))                                                                                                                                               

字符排序默认区分大小小,以首字母ASCII编码为根据,从小到达排序:

    var array10=["ant","Boy","cat","Dog"];
    console.log(array10.sort());      //["Boy", "Dog", "ant", "cat"]
    console.log(
            array10.sort(function(s,t){
            var a= s.toLowerCase();
                var b= t.toLowerCase();
                if(a<b) return -1;
                if(a>b) return 1;
                return 0;
            })
    );         //   ["ant", "Boy", "cat", "Dog"]                             

6.4 concat() 数组连接

     var array11=[1,2,3];
    console.log(array11.concat(4,5));     //[1,2,3,4,5]
    console.log(array11.concat([4,5]));    //[1,2,3,4,5]
    console.log(array11.concat("4",[5,[6,[7,8]]]))       //[1, 2, 3, "4", 5, Array[2]]   

6.5  slice(第一个位置,第二个位置)

返回从第一个位置(包括)到第二个位置的子数组;

如果只制定一个参数,则返回从指定位置到数组结尾的所有元素组成的子数组;

若参数出现负数,则标识从后往前数的位置下标;

    var array12=[1,2,3,4,5];
    console.log(array12.slice(0,3));   //[1,2,3]
    console.log(array12.slice(3));    //[4,5]
    console.log(array12.slice(-1));   //[5]
    console.log(array12.slice(1,-1));   //[2,3,4]     

6.6  splice(插入或删除的起始位置,删除元素的个数) 在数组中插入、删除或替换元素的通用方法:

    var array13=[1,2,3,4,5,6,7,8];
    //删除
    console.log(array13.splice(4));     //[5,6,7,8]
    console.log(array13);         //[1,2,3,4]
    console.log(array13.splice(1,2));  //[2,3]
    console.log(array13); //   [1,4]
    //插入
    array13.splice(1,0,"pomelo");
    console.log(array13);      //[1, "pomelo", 4]
    //替换
    var array14=[1,2,3,4,5];
    array14.splice(2,1,"pomelo");   //[1, 2, "pomelo", 4, 5]
    console.log(array14)                                         

6.7  map() 将调用此函数的数组的每个元素传递给指定函数:

    var array15=[1,2,3];
    var array16=array15.map(function(i){
        return i*i;
    });
    console.log(array16)    //[1,4,9]             

-------------持续更新中-----------

时间: 2024-10-24 21:22:35

javascript数组详解(js数组深度解析)的相关文章

(转)awk数组详解及企业实战案例

awk数组详解及企业实战案例 原文:http://www.cnblogs.com/hackerer/p/5365967.html#_label03.打印数组:1. [[email protected] test]# awk 'BEGIN{array[1]="zhurui";array[2]="zhuzhu";for(key in array) print key,array[key]}'2. 1 zhurui3. 2 zhuzhu4. [[email protect

BIT 树状数组 详解 及 例题

(一)树状数组的概念 如果给定一个数组,要你求里面所有数的和,一般都会想到累加.但是当那个数组很大的时候,累加就显得太耗时了,时间复杂度为O(n),并且采用累加的方法还有一个局限,那就是,当修改掉数组中的元素后,仍然要你求数组中某段元素的和,就显得麻烦了.所以我们就要用到树状数组,他的时间复杂度为O(lgn),相比之下就快得多.下面就讲一下什么是树状数组: 一般讲到树状数组都会少不了下面这个图: 下面来分析一下上面那个图看能得出什么规律: 据图可知:c1=a1,c2=a1+a2,c3=a3,c4

算法学习笔记 KMP算法之 next 数组详解

最近回顾了下字符串匹配 KMP 算法,相对于朴素匹配算法,KMP算法核心改进就在于:待匹配串指针 i 不发生回溯,模式串指针 j 跳转到 next[j],即变为了 j = next[j]. 由此时间复杂度由朴素匹配的 O(m*n) 降到了 O(m+n), 其中模式串长度 m, 待匹配文本串长 n. 其中,比较难理解的地方就是 next 数组的求法.next 数组的含义:代表当前字符之前的字符串中,有多大长度的相同前缀后缀,也可看作有限状态自动机的状态,而且从自动机的角度反而更容易推导一些. "前

“全栈2019”Java第二十八章:数组详解(上篇)

难度 初级 学习时间 10分钟 适合人群 零基础 开发语言 Java 开发环境 JDK v11 IntelliJ IDEA v2018.3 文章原文链接 "全栈2019"Java第二十八章:数组详解(上篇) 下一章 "全栈2019"Java第二十九章:数组详解(中篇) 学习小组 加入同步学习小组,共同交流与进步. 方式一:关注头条号Gorhaf,私信"Java学习小组". 方式二:关注公众号Gorhaf,回复"Java学习小组"

“全栈2019”Java第三十章:数组详解(下篇)

难度 初级 学习时间 10分钟 适合人群 零基础 开发语言 Java 开发环境 JDK v11 IntelliJ IDEA v2018.3 文章原文链接 "全栈2019"Java第三十章:数组详解(下篇) 下一章 "全栈2019"Java第三十一章:二维数组和多维数组详解 学习小组 加入同步学习小组,共同交流与进步. 方式一:关注头条号Gorhaf,私信"Java学习小组". 方式二:关注公众号Gorhaf,回复"Java学习小组&qu

“全栈2019”Java第三十一章:二维数组和多维数组详解

难度 初级 学习时间 10分钟 适合人群 零基础 开发语言 Java 开发环境 JDK v11 IntelliJ IDEA v2018.3 文章原文链接 "全栈2019"Java第三十一章:二维数组和多维数组详解 下一章 "全栈2019"Java第三十二章:增强for循环Foreach语法 学习小组 加入同步学习小组,共同交流与进步. 方式一:关注头条号Gorhaf,私信"Java学习小组". 方式二:关注公众号Gorhaf,回复"Ja

详解js面向对象编程

转自:http://segmentfault.com/a/1190000000713346 基本概念 ECMA关于对象的定义是:”无序属性的集合,其属性可以包含基本值.对象或者函数.“对象的每个属性或方法都有一个名字,而每个名字都映射到一个值. 类 在现实生活中,相似的对象之间往往都有一些共同的组成特征.类,实际上是对象的设计蓝图或者制作配方.我们能基于相同的类创建出许多不同的对象,这些对象又会含有各自的属性和方法. 封装 封装主要用于阐述对象中所包含(或封装的内容),它通常由两部分组成: 相关

详解js变量、作用域及内存

详解js变量.作用域及内存 来源:伯乐在线 作者:trigkit4 原文出处: trigkit4 基本类型值有:undefined,NUll,Boolean,Number和String,这些类型分别在内存中占有固定的大小空间,他们的值保存在栈空间,我们通过按值来访问的. JavaScript 1 2 (1)值类型:数值.布尔值.null.undefined. (2)引用类型:对象.数组.函数. 如果赋值的是引用类型的值,则必须在堆内存中为这个值分配空间.由于这种值的大小不固定(对象有很多属性和方

RN FlatList使用详解及源码解析

FlatList使用详解及源码解析 前言 长列表或者无限下拉列表是最常见的应用场景之一.RN 提供的 ListView 组件,在长列表这种数据量大的场景下,性能堪忧.而在最新的 0.43 版本中,提供了 FlatList 组件,或许就是你需要的高性能长列表解决方案.它足以应对大多数的长列表场景. 一.功能简介 FlatList高性能的简单列表组件,支持下面这些常用的功能: 完全跨平台. 支持水平布局模式. 行组件显示或隐藏时可配置回调事件. 支持单独的头部组件. 支持单独的尾部组件. 支持自定义

JavaScript事件详解-zepto的事件实现

zepto的event 可以结合上一篇JavaScript事件详解-原生事件基础(一)综合考虑源码暂且不表,github里还有中文网站都能下到最新版的zepto.整个event模块不长,274行,我们可以看到,整个event模块,事件绑定核心就是on和off,还有一个trigger用来触发,类观察者模式,可以先看看汤姆大叔的深入理解JavaScript系列(32):设计模式之观察者模式,其余皆为实现的处理函数.首先来个demo: $("#btn").on("click&quo