Array 对象

  之前已经了解了 Array(数组)的定义和基本操作。数组的基本操作

  下面来学习更多的方法。

检测一个对象是否是数组

instanceof                   // 看看该变量是否是该对象的实例

Array.isArray(变量名/参数) // HTML5 中提供的方法,有兼容性问题

  注意:instanceof 用法

变量名 instanceof 构造函数

  instanceof 不仅仅局限于数组,也可以用来检测其他的对象,用法相同。

输出数组

toString()                 // 把数组转化为字符串,用逗号分隔每一项

valueOf()                  // 返回数组对象本身

常用方法

  1、栈操作(先进后出)

push()                    // 将一个或多个元素添加到数组的末尾,并返回该数组的新长度。
pop() // 去除数组中的最后一项,并返回该元素的值,修改 length 属性

  2、队列操作(先进先出)

push()                   // 将一个或多个元素添加到数组的末尾,并返回该数组的长度
shift() // 取出数组中的第一个元素,修改 length 属性
unshift() // 在数组最前面插入项,返回数组的长度

  3、排序方法

reverse()                // 翻转数组
sort() // 默认排序顺序是在将元素转换为字符串,然后比较它们的UTF-16代码单元值序列时构建的

  4、操作方法

concat(参数)              // 把参数拼接到当前数组
slice(begin,end) // 把当前数组中截取一个新的数组,不影响原来的数组(包括 begin,不包括 end)
splice()                 // 删除或替换现有元素或者原地添加新的元素来修改数组,并以数组形式返回被修改的内容。此方法会改变原数组。

  5、位置方法

indexof()                // 返回在数组中可以找到一个给定元素的第一个索引,如果不存在,则返回-1。
lastindexof() // 返回指定元素在数组中的最后一个的索引,如果不存在则返回 -1。从数组的后面向前查找,

  6、迭代方法(不会修改原数组 HTML5中的方法)

every()                  // 测试一个数组内的所有元素是否都能通过某个指定函数的测试。它返回一个布尔值。(若收到一个空数组,此方法在一切情况下都会返回 true。)
filter() // 创建一个新数组, 其包含通过所提供函数实现的测试的所有元素。
forEach() // 对数组的每个元素执行一次提供的函数
map() // 创建一个新数组,其结果是该数组中的每个元素都调用一个提供的函数后返回的结果。
some() // 测试是否至少有一个元素可以通过被提供的函数方法。该方法返回一个Boolean类型的值。

  7、连接至字符串方法

join(参数)                // 将数组的所有元素使用参数连接到一个字符串,若没有参数,使用逗号进行连接

  8、清空数组方法

arr = [];                // 推荐使用

arr.length = 0;

arr.splice(0,arr.length);

案例:

  1、将一个字符串数组输出为 | 分割的形式。如'a|b|c|d'。使用两种方式实现。

 // 方式一
  var array = [a,b,c,d,e,f];
  console.log(array.join('|'));
// 方式二
function myJoin(array, seperator) {
seperator = seperator || ',';
array = array || [];
if (array.length == 0){
return '';
}
var str = array[0];
for (var i = 1; i < array.length; i++) {
str += seperator + array[i];
}
return str;
}
var array = [6, 3, 5, 6, 7, 8, 0];
console.log(myJoin(array, '-'));

  2、将一个字符串数组的元素的顺序进行翻转。使用两种方式。

 // 方式一
  var array = ['a','b','c','e','f'];
  console.log(array.reverse());
// 方式二
function myReverse(arr) {
if (!arr || arr.length == 0) {
return [];
}
for (var i = 0; i < arr.length / 2; i++) {
var tmp = arr[i];
arr[i] = arr[this.length - i - 1];
arr[arr.length - i - 1] = tmp;
}
return arr;
} var array = ['a', 'b', 'c'];
console.log(myReverse(array));

  3、工资的数组[1500, 1200, 2000, 2100, 1800],把工资超过2000的删除。

 // 方式一
var array = [1500,1200,2000,2100,1800];
var tmpArray = [];
for (var i = 0; i < array.length; i++) {
if(array[i] < 2000) {
tmpArray.push(array[i]);
}
}
console.log(tmpArray);
// 方式二
var array = [1500, 1200, 2000, 2100, 1800];
array = array.filter(function (item, index) {
if (item < 2000) {
return true;
}
return false;
});
console.log(array);

  4、["c", "a", "z", "a", "x", "a"]找到数组中每一个a出现的位置。

 var array =  ['c', 'a', 'z', 'a', 'x', 'a'];
var index = -1;
do {
index = array.indexOf('a',index + 1);
if (index !== -1){
console.log(index);
}
} while (index > 0);

  5、编写一个方法去掉一个数组的重复元素。

 function clear(arr) {
// 1 如何获取数组中每一个元素出现的次数
var o = {}; // 记录数组中元素出现的次数
for (var i = 0; i < arr.length; i++) {
var item = arr[i]; // 数组中的每一个元素
// o[item] = 1;
// 判断o对象是否有当前遍历到的属性
if (o[item]) {
// 如果o[item] 存在,说明次数不为1
o[item]++;
} else {
// 如果o[item] 不存在,说明是第一次出现
o[item] = 1;
}
}
// console.log(o); // 2 生成一个新的数组,存储不重复的元素
var newArray = [];
// 遍历对象o中的所有属性
for (var key in o) {
// 判断o对象中当前属性的值是否为 1 如果为1 说明不重复直接放到新数组中
if (o[key] === 1) {
newArray.push(key);
} else {
// o对象中当前属性 次数不为1 ,说明有重复的,如果有重复的话,只存储一次
// 判断当前的newArray数组中是否已经有该元素
if (newArray.indexOf(key) === -1) {
newArray.push(key);
}
}
}
return newArray;
} var array = ['c', 'a', 'z', 'a', 'x', 'a'];
var newArray = clear(array);
console.log(newArray);

  6、sort排序。

 var arr = [25, 10, 108, 18];
// 默认情况下的sort是对字符编码 从小到大排序
arr.sort();
console.log(arr); // 除了默认排序外,还可以指定比较器
function compare1(a, b) {
return a - b;
}
function compare2(a, b) {
return b - a;
}
arr.sort(compare1);
arr.sort(compart2); // 还可以直接指定比较器
arr.sort(function (a,b) {
return a - b;
})

  7、模拟 sort 内部实现。

 // 对数组排序,从小到大  -- 冒泡排序
function sort(array, fnCompare) {
// 外层循环 控制趟数
for (var i = 0; i < array.length - 1; i++) {
// 假设排好序了
var isSort = true;
// 内层循环 控制比较的次数
for (var j = 0; j < array.length - 1 - i; j++) { if (fnCompare(array[j], array[j + 1]) > 0) {
isSort = false;
// 交换位置
var tmp = array[j];
array[j] = array[j + 1];
array[j + 1] = tmp;
}
}
// 判断是否排好了
if (isSort) {
break;
}
}
} var arr = [56, 10, 1, 17]; sort(arr, function (a, b) {
return b - a;
}) console.log(arr);

JavaScript 之 Array 对象的更多相关文章

  1. JavaScript 数组(Array)对象的方法

    JavaScript 数组(Array)对象的方法 concat() 描述:用于连接两个或多个数组.该方法不会改变现有的数组,而仅仅会返回被连接数组的一个副本. 原型:arrayObject.conc ...

  2. JavaScript 数组(Array)对象

    Array 对象 Array 对象用于在单个的变量中存储多个值. 创建 Array 对象的语法: new Array(); new Array(size); new Array(element0, e ...

  3. JavaScript:Array 对象

    ylbtech-JavaScript:Array 对象 1. 返回顶部 Array 对象 Array 对象用于在单个的变量中存储多个值. 创建 Array 对象的语法: new Array(); ne ...

  4. JavaScript操作Array对象常用的方法

     转换方法 因为JavaScript内部机制(继承),所有的对象都具有toLocalString() .toString().valueOf()方法,Array也不例外so:var colors = ...

  5. 详解Javascript中的Array对象

    基础介绍 创建数组 和Object对象一样,创建Array也有2种方式:构造函数.字面量法. 构造函数创建 使用构造函数的方式可以通过new关键字来声明,如下所示: 12 var arr = new ...

  6. JavaScript中Array(数组) 对象

    JavaScript中Array 对象 JavaScript中创建数组有两种方式 (一)使用直接量表示法: var arr4 = []; //创建一个空数组var arr5 = [20]; // 创建 ...

  7. JavaScript Array对象

    介绍Js的Array 数组对象. 目录 1. 介绍:介绍 Array 数组对象的说明.定义方式以及属性. 2. 实例方法:介绍 Array 对象的实例方法:concat.every.filter.fo ...

  8. JavaScript基础18——js的Array对象

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  9. JavaScript Array 对象

    JavaScript Array 对象 Array 对象 Array 对象用于在变量中存储多个值: var cars = ["Saab", "Volvo", & ...

随机推荐

  1. 06-C#笔记-常量

    1. 进制 前缀:0x 或 0X 表示十六进制,0 表示八进制,没有前缀则表示十进制. 后缀:可以是 U 或 L 的组合,其中,U 和 L 分别表示 unsigned 和 long.后缀可以是大写或者 ...

  2. 学习-guava

    Guava Guava工程包含了若干被Google的 Java项目广泛依赖 的核心库 例如:集合 [collections] .缓存 [caching] .原生类型支持 [primitives sup ...

  3. [RN] React Native 使用 teaset(Drawer)实现侧边菜单

    https://www.cnblogs.com/crazycode2/p/9537518.html

  4. NOIP2019翻车前计划以及日记

    目前只有日记和草拟计划(Sua机洗点~),等停课后会实施计划,试行期为一天. 根据试行期的学习效果制定计划. update 1:试行期结束,完全可以按计划来. update 2:计划暂时变更,以适应我 ...

  5. TCP/IP协议族体系结构:死也不能忘记的四个层

    1.死也不能忘记的四个层 ①数据链路层实现了网卡接口的网络驱动程序,以处理数据在物理媒介(比如以太网.令牌环等)上的传输.主要的协议ARP和RARP经过数据链路层封装的数据成为帧,有以太网帧.令牌环帧 ...

  6. 识别led灯和驱动器的关联关系

    精准答案: https://wenku.baidu.com/view/db1f7361ac02de80d4d8d15abe23482fb4da02d6.html?qq-pf-to=pcqq.group ...

  7. Javascript Asynchronous Investigation

    介绍 同步任务:在主线程上排队执行的任务,只有前一个任务执行完毕,才能执行后一个任务: 异步任务:不进入主线程,而进入任务队列中的任务,只有任务队列通知主线程,某个异步任务可以执行了,这个任务才会进入 ...

  8. Hyperledger Fabric 1.4 快速环境搭建

    自己的硕士研究方向和区块链有关,工程上一直以IBM的Hyperledger Fabric为基础进行开发,对该项目关注也有两年了.目前迎来了Hyperledger Fabric v1.4,这也是Fabr ...

  9. 《Linux就该这么学》培训笔记_ch08_iptables与firewall防火墙

    <Linux就该这么学>培训笔记_ch08_iptables与firewall防火墙 文章最后会post上书本的笔记照片. 文章主要内容: 防火墙管理工具 iptables firewal ...

  10. docker 学习操作记录 1

    记录1 Xshell (Build ) Copyright (c) NetSarang Computer, Inc. All rights reserved. Type `help' to learn ...