一、与其他语言数据的比较

   相同点:有序列表
   不同点:js的数组的每一项可以保存任何类型的数据;数组的大小是可以动态调整的

二、数组创建的两种方法

1)  var colors = new Array();//创建一个空数组,new可省略
     var colors = new Array(3);//创建一个包含3项的数组
     var colors = new Array("red","green","blue");//创建一个包含3个字符串的数组
2)var names = [];
     var names = ["red","green","blue"];//names[2]

三、数组的length属性

1)  检测数组的项数
2)可设置
var names = ["red","green","blue"];
names.length = 4;
alert(names[3]);//undefined names.length = 2; //截断数字
alert(names[2]);//undefined names[names.length]="black";
alert(names);//red,green,blue,black names[99]="yellow";
alert(names.length);//         

四、数组方法

1) 检测数组方法
  Array.isArray()
2)转换方法
  toString():返回由数组中每个值的字符串形式拼接而成的一个以逗号分隔的字符串;
  valueOf():返回的还是数组,返回数值类型的对象类型
  join():接受一个参数,已这个字符来连接数组成一个字符串
3)栈方法(LIFO)先进后出
  push():接收任意数量的参数,逐个添加到数组的末尾,返回修改后数组的长度
  pop():从数组末尾移除最后一项,返回移除的项
4)队列方法(FIFO)先进先出
  shift(): 移除数组的第一项,并返回该项
  unshift():在数组最前端添加任意个项,并返回新数组长度
5)重排序方法
  reverse():反转数组项
  sort():默认按升序排列,调用每个数组项的toString()方法,然后比较得到的字符串,sort()可以接收一个比较参数,返回的还是数组
6)操作方法
(1)concat():先创建当前数组的一个副本,接收的参数是一个或多个数组,将这些数组的每一项都添加到结果数组中
  var names = ["red","green","blue"];
  var names1 = names.concat("brown",["black","dede"]);
(2)slice():
  var names = ["red","green","blue"];
  var names1 = names.slice(1);//green,blue
  var names2 = names.slice(1,2);//green,blue
  删除:slice(0,2)
  插入:slice(2,0,"red","frr");//从位置2开始插入
  替换:slice(2,1,"red","frr")//删除位置2的项,然后再插入两项
7)位置方法(都是可以接收两个参数,要查找的项和(可选)表示查找起点位置的索引)
  indexOf():从数组的开头向后查,返回要查找的项在数组中的位置
  lastIndexOf():从数组的末尾向前查,返回要查找的项在数组中的位置
8)迭代方法
  every():对数组的每一项运行给定函数,如果该函数对每一项给返回true,则返回true
  filter():返回由给定函数过滤后的数组
  forEach():只是对数组的每一项运行给定函数,没有返回值
  map():对数组的每一项运行给定函数,返回函数运行结果组成的数组
  some():对数组的每一项运行给定函数,如果该函数对某一项返回true,则返回true
9)归并方法
  reduce():这里和python的list方法特别像,自己的理解,会根据每一项上调用的函数,迭代数组的每一项,然后返回一个最后的结果
  reduceRight():同reduce(),只是从数组的最后一项开始迭代

五、数组的判别方法

5.1 JavaScript的数据类型

  JavaScript共有六种数据类型,分别是:number、string、object、Boolean、null、undefined

5.2 类型判断方法

  使用typeof可以判断大部分数据类型,使用方法为:

var a = "abc";
console.log(typeof a); //string var a = 123;
console.log(typeof a); //number var a = false;
console.log(typeof a); //boolean var a;
console.log(typeof a); //false var a = null;
console.log(typeof a); //object var a = document;
console.log(typeof a); //object var a = [];
console.log(typeof a); //object var a = function(){};
console.log(typeof a) //function 除了可以判断数据类型还可以判断function类型

  可以发现object、null、undefined返回的都是object,而函数返回的类型是function。今天就先来看下如何判断给定数据是否是数组类型吧。

5.3 数组类型判断

(1)使用instanceof运算符判断

var arr=[];
console.log(arr instanceof Array) //返回true

(2)使用constructor判断

  constructor属性是返回对创建此对象的函数的引用,举个栗子说明constructor的使用吧:

function employee(name,job,born) {
this.name=name;
this.job=job;
this.born=born;
} var bill=new employee("Bill Gates","Engineer",1985);
console.log(bill.constructor);
/* 输出结果:
function employee(name,job,born) {
this.name=name;
this.job=job;
this.born=born;
}
*/

  so,使用constructor属性判断数组的使用方式就是:

console.log([].constructor == Array);

(3)使用constructor判断的增强方式

function isArray(object){
return object && typeof object==='object' &&
Array == object.constructor;
}

  使用这种方式有一点是需要注意的:

  使用instaceof和construcor,被判断的array必须是在当前页面声明的!比如,一个页面(父页面)有一个框架,框架中引用了一个页面(子页面),在子页面中声明了一个array,并将其赋值给父页面的一个变量,这时判断该变量,Array == object.constructor;会返回false。
  原因:
a) array属于引用型数据,在传递过程中,仅仅是引用地址的传递。
b) 每个页面的Array原生对象所引用的地址是不一样的,在子页面声明的array所对应的构造函数是子页面的Array对象;父页面来进行判断,使用的Array并不等于子页面的Array;切记,不然很难跟踪问题!

(4)最复杂的判断方式

function isArray(object){
return object && typeof object==='object' &&
typeof object.length==='number' &&
typeof object.splice==='function' &&
//判断length属性是否是可枚举的 对于数组 将得到false
!(object.propertyIsEnumerable('length'));
}

  有length和splice并不一定是数组,因为可以为对象添加属性,而不能枚举length属性,才是最重要的判断因子。

  

  大家可能对propertyIsEnumerable 方法不太熟悉,该方法是用来判断指定的属性是否可列举:

  object. propertyIsEnumerable(proName)

  如果 proName 存在于 object 中且可以使用一个 for…in 循环穷举出来,那么propertyIsEnumerable属性返回 true。如果 object 不具有所指定的属性或者所指定的属性不是可列举的,那么propertyIsEnumerable 属性返回 false。propertyIsEnumerable 属性不考虑原型链中的对象。

(5)最简单的判断方式

function isArray(o) {
return Object.prototype.toString.call(o) === '[object Array]';
}
var arr = [1,2,3];
console.log(isArray(arr));

六、面试常考的数组的题型

//排序算法
window.onload = function(){
var array = [0,1,2,44,4,
324,5,65,6,6,
34,4,5,6,2,
43,5,6,62,43,
5,1,4,51,56,
76,7,7,2,1,
45,4,6,7,8];
//var array = [4,2,5,1,0,3];
array = sorting.shellSort(array);
alert(array);
} var sorting = {
//利用sort方法进行排序
systemSort: function(arr){
return arr.sort(function(a,b){
return a-b;
});
}, //冒泡排序
bubbleSort: function(arr){
var len=arr.length, tmp;
for(var i=0;i<len-1;i++){
for(var j=0;j<len-1-i;j++){
if(arr[j]>arr[j+1]){
tmp = arr[j];
arr[j] = arr[j+1];
arr[j+1] = tmp;
}
}
}
return arr;
}, //快速排序
quickSort: function(arr){
var low=0, high=arr.length-1;
sort(low,high);
function sort(low, high){
if(low<high){
var mid = (function(low, high){
var tmp = arr[low];
while(low<high){
while(low<high&&arr[high]>=tmp){
high--;
}
arr[low] = arr[high];
while(low<high&&arr[low]<=tmp){
low++;
}
arr[high] = arr[low];
}
arr[low] = tmp;
return low;
})(low, high);
sort(low, mid-1);
sort(mid+1,high);
}
}
return arr;
}, //插入排序
insertSort: function(arr){
var len = arr.length;
for(var i=1;i<len;i++){
var tmp = arr[i];
for(var j=i-1;j>=0;j--){
if(tmp<arr[j]){
arr[j+1] = arr[j];
}else{
arr[j+1] = tmp;
break;
}
}
}
return arr;
}, //希尔排序
shellSort: function(arr){
console.log(arr);
var h = 1;
while(h<=arr.length/3){
h = h*3+1; //O(n^(3/2))by Knuth,1973
}
for( ;h>=1;h=Math.floor(h/3)){
for(var k=0;k<h;k++){
for(var i=h+k;i<arr.length;i+=h){
for(var j=i;j>=h&&arr[j]<arr[j-h];j-=h){
var tmp = arr[j];
arr[j] = arr[j-h];
arr[j-h] = tmp;
}
}
}
}
return arr;
}
}

小白科普之JavaScript的数组的更多相关文章

  1. 小白科普之JavaScript的函数

    一 概述 1.1 函数声明 (1)function命令 函数就是使用function命令命名的代码区块,便于反复调用.这种声明方式叫做函数的声明(Function Declaration). func ...

  2. 小白科普之JavaScript的BOM模型

    一.什么是BOM 1. BOM是browser object model的缩写,简称浏览器对象模型: 2. BOM提供了独立于内容而与浏览器窗口进行交互的对象,描述了与浏览器进行交互的方法和接口: 3 ...

  3. 小白科普之JavaScript的JSON

    一.对json的理解     json是一种数据格式,不是一种编程语言,json并不从属于javascript.     json的语法可以表示以下三种类型的值     1)简单值           ...

  4. 小白科普之JavaScript的DOM模型

    微信公众号“前端大全”推送了一篇名为“通俗易懂的来讲讲DOM”的文章,把javascript原生DOM相关内容讲解的很详细.仔细读了一遍,觉得整理总结的不错,对自己也很使用,所以把内容整理过来,并根据 ...

  5. JavaScript Array数组方法详解

    Array类型是ECMAScript中最常用的引用类型.ECMAScript中的数据与其它大多数语言中的数组有着相当大的区别.虽然ECMAScript中的数据与其它语言中的数组一样都是数据的有序列表, ...

  6. JavaScript从数组中删除指定值元素的方法

    本文实例讲述了JavaScript从数组中删除指定值元素的方法.分享给大家供大家参考.具体分析如下: 下面的代码使用了两种方式删除数组的元素,第一种定义一个单独的函数,第二种为Array对象定义了一个 ...

  7. JavaScript中数组操作常用方法

    JavaScript中数组操作常用方法 1.检测数组 1)检测对象是否为数组,使用instanceof 操作符 if(value instanceof Array) { //对数组执行某些操作 } 2 ...

  8. javascript常用数组算法总结

    1.数组去重 方法1: JavaScript //利用数组的indexOf方法 function unique (arr) { var result = []; for (var i = 0; i & ...

  9. javascript中数组的22种方法

    × 目录 [1]对象继承 [2]数组转换 [3]栈和队列[4]数组排序[5]数组拼接[6]创建数组[7]数组删改[8]数组位置[9]数组归并[10]数组迭代[11]总结 前面的话 数组总共有22种方法 ...

随机推荐

  1. 一个优秀的Android应用从建项目开始

    1.项目结构 现在的MVP模式越来越流行.就默认采用了.如果项目比较小的话: app——Application Activity Fragment Presenter等的顶级父类 config——AP ...

  2. IT男的”幸福”生活

    IT男的”幸福”生活 IT男的”幸福”生活"续1 IT男的”幸福”生活"续2  IT男的”幸福”生活"续3  IT男的”幸福”生活"续4  IT男的”幸福”生活 ...

  3. node 大牛的blog

    node一些基本的核心包的使用  http://cnodejs.org/topic/548e53f157fd3ae46b2334fd node的基本的三种框架的比较  http://cnodejs.o ...

  4. NuGet更新引用Dll

    第一种 通过 "Add Library Package Reference..." 添加 点击 ‘Add Library Package Reference...’ , 搜索你要添 ...

  5. 第一章 : javaScript框架分类及主要功能

      从内部架构和理念划分,目前JavaScript框架可以划分为5类. 第一种是以命名空间为导向的类库或框架,如果创建一个数组用new Array(),生成一个对象用new Object(),完全的j ...

  6. 由DataGridTextColumn不能获取到父级DataContext引发的思考

    在项目中使用DataGrid需要根据业务动态隐藏某些列,思路都是给DataGrid中列的Visibility属性绑定值来实现(项目使用MVVM),如下 <DataGridTextColumn H ...

  7. linux查看cpu、内存、版本信息

    1.  查看物理CPU的个数#cat /proc/cpuinfo |grep "physical id"|sort |uniq|wc –l 2.   查看逻辑CPU的个数#cat ...

  8. 日志框架对比 NLog VS Log4net

    Log4net 先说Log4net,它是.net平台上一个老牌的日志框架,我接触的时间也不长(因为公司有自己的日志库),但是看着各开源库都在用这个于是前段时间也尝试去了解了一下. 首先让我认识到Log ...

  9. publish_subscribe

    <!DOCTYPE html> <html> <head> <title></title> </head> <body&g ...

  10. word-break:brea-all;word-wrap:break-word的区别

    //form==>http://www.cnblogs.com/2050/archive/2012/08/10/2632256.html <p style="background ...