目录

创建数组的两种方式

 1. 利用数组字面量

2. 利用new Array()

数组访问

 数组API

(1)数组序列化

1. toString() 将我们的数组转换为字符串

2. join(分隔符)

(2)构造函数的方法

(3)栈与队列方法

(4)排序方法

(5)操作方法

(6)位置方法

   (7)迭代方法

数组去重例子


创建数组的两种方式


 1. 利用数组字面量

var arr = [1, 2, 3];
 var name="name"

2. 利用new Array()

var arr=new Array();       //创建了一个空数组
var arr1 = new Array(1, 2);    //等价于[1,2]

数组访问

  1.  [index]直接访问,索引可以超过索引范围,只不过访问的值是undefined。
  2. length-1=Max(index)。
  3. length+N或length-N 开辟新的内存空间或数组元素的删除。

 数组API

(1)数组序列化


1. toString() 将我们的数组转换为字符串

在默认的情况下会以逗号分隔字符串的形式返回数组项。

var arr = [1, 2, 3];
 console.log(arr.toString());   //1,2,3


2. join(分隔符)

使用指定的字符串来分隔数组字符串。

var arr1 = ['green', 'blue', 'pink'];
console.log(arr1.join());   //green,blue,pink
console.log(arr1.join('-'));   //green-blue-pink

(2)构造函数的方法


1. instanceof 运算符,它可以用来检测是否数组

var arr = [];
var obj = {};
console.log(arr instanceof Array);  //true
console.log(obj instanceof Array);  //false

2. Array.isArray(参数)  H5新增的方法 ie9以上版本支持

console.log(Array.isArray(arr));   //true
 console.log(Array.isArray(obj));   //false

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

var myArr = Array.from("ABCD");
console.log(myArr);
//输出结果为["A","B","C","D"]

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

Array.of(7);       // [7] 
Array.of(1, 2, 3); // [1, 2, 3]

(3)栈与队列方法

1. Array.prototype.push()
push() 在我们数组的末尾添加一个或者多个数组元素,并返回新的长度。

 var arr = [1, 2, 3];
 console.log(arr.push(4, '小'));  //5
 console.log(arr);                //[1, 2, 3, 4, '小']
// (1)push 是可以给数组追加新的元素
// (2)push 参数直接写数组元素就可以了
// (3)push完毕之后,返回的结果是新数组的长度
// (4)原数组也会发生变化

2. Array.prototype.unshift()

unshift  在我们数组的开头添加一个或者多个元素,并返回新的长度。

 console.log(arr.unshift('red', 'def'));  //7
console.log(arr);               //['red', 'def', 1, 2, 3, 4, '小']
 // (1)unshift 是可以给数组前面追加新的元素
 // (2)unshift() 参数直接写 数组元素就可以了
 // (3)unshift完毕之后,返回的结果是新数组的长度
 // (4)原数组也会发生变化

3.Array.prototype.pop()
 pop() 它删除数组的最后一个元素并返回删除的元素。

console.log(arr.pop());  //小
 console.log(arr);   //['red', 'def', 1, 2, 3, 4]
// (1)pop 是可以给删除数组最后一个元素,记住只能删除一个元素
// (2)pop() 没有参数
// (3)pop 完毕之后,返回的结果是 删除的那个元素
// (4)原数组也会发生变化

4.Array.prototype.shift()

shift() 它可以删除数组第一个元素,并返回该元素的值。
      

 console.log(arr.shift());   //red
console.log(arr);           //['def', 1, 2, 3, 4]
// (1)shift 是可以给删除数组第一个元素  记住只能删除一个元素
// (2)shift() 没有参数
// (3)shift 完毕之后,返回的结果是 删除的那个元素
// (4)原数组也会发生变化

(4)排序方法

1. Array.prototype.reverse()

reverse() 方法用于颠倒数组中元素的顺序。

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.reverse();
console.log(fruits)
//fruits结果输出:Mango,Apple,Orange,Banana
 // 1.翻转数组

        var arr = ['pink', 'red', 'blue'];
        arr.reverse();
        console.log(arr);   //['blue', 'red', 'pink']
        // 2.数组排序(冒泡排序)
        var arr1 = [13, 4, 77, 1, 7];
        arr1.sort(function (a, b) {
            // return a-b;   升序的顺序排列
            return b - a;   //降序的顺序排列
        })
        console.log(arr1);   //[77, 13, 7, 4, 1]

2.Array.prototype.sort()

sort() 方法用于对数组的元素进行排序。如果调用该方法时没有使用参数,将按字母顺序(Ascall编码)对数组中的元素进行排序。

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.sort();
console.log(fruits)
//fruits 输出结果:Apple,Banana,Mango,Orange

(5)操作方法

1. Array.prototype.concat()

concat() 方法用于连接两个或多个数组。

var hege = ["A", "B"]; 
var stale = ["Emil", "Tobias", "Linus"]; 
var kai = ["Robin"]; 
var children = hege.concat(stale,kai);
//children 输出结果:A,B,Emil,Tobias,Linus,Robin

2. Array.prototype.slice()

slice() 方法可从已有的数组中返回选定的元素。

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"]; 
var citrus = fruits.slice(1,3);
//citrus 结果输出:Orange,Lemon

3.Array.prototype.splice()

splice() 方法用于添加或删除数组中的元素。

添加元素:

var fruits = ["Banana", "Orange", "Apple", "Mango"];
//从数组索引位置 2 开始,不删除元素,添加两个新的元素"Lemon","Kiwi"
fruits.splice(2,0,"Lemon","Kiwi");
//fruits输出结果:Banana,Orange,Lemon,Kiwi,Apple,Mango

移除元素和添加元素:

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2,1,"Lemon","Kiwi");

//fruits输出结果:Banana,Orange,Lemon,Kiwi,Mango

移除元素:

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2,2);

//fruits输出结果:Banana,Orange

(6)位置方法

1. Array.prototype.indexOf()

  •  indexOf(数组元素) 作用就是返回该数组元素的索引号,从前面找
  • 它只返回第一个满足的索引号
  • 它如果在该数组里面找不到元素,则返回的是 -1
var fruits = ["Banana", "Orange", "Apple", "Mango"]; 
var a = fruits.indexOf("Apple");

//a结果输出:2
//以上输出结果意味着 "Apple" 元素位于数组中的第 3 个位置。

2.Array.prototype.lastIndexOf()

从该字符串的后面向前查找。

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var a = fruits.lastIndexOf("Apple");

//a输出结果:2
//以上实例输出结果意味着 "Apple" 位于数组中的第 2 个位置.

(7)迭代方法

1. Array.prototype.every()

every() 方法用于检测数组所有元素是否都符合指定条件(通过函数提供)。如果满足条件返回true,否则返回false。

注意:every()不会对空数组进行检测,也不会改变原数组。

语法

array.every(function(currentValue,index,arr), thisValue)

参数

参数描述
function(currentValue, index,arr)必须。函数,数组中的每个元素都会执行这个函数 函数参数见下表
thisValue可选。对象作为该执行回调时使用,传递给函数,用作 "this" 的值。 如果省略了 thisValue ,"this" 的值为 "undefined"
参数描述
currentValue必须。当前元素的值
index可选。当前元素的索引值
arr可选。当前元素属于的数组对象
var ages = [32, 33, 16, 40];

var result = ages.every(function (age) {
  return age >= 17
})
console.log(result);//输出结果为:false

2. Array.prototype.some()

some() 方法用于检测数组中的元素是否满足指定条件(函数提供),如果有一个条件为true,则不会再执行检测,否则返回false。

语法

array.some(function(currentValue,index,arr),thisValue)

参数和上面的一样。

var ages = [32, 33, 16, 40];

var result = ages.some(function (age) {
  return age >= 17
})
console.log(result);//输出结果为:true

3.Array.prototype.filter()

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

注意:fiflter()不会对空数组进行检测,不会改变原来的数组。

语法

array.filter(function(currentValue,index,arr), thisValue)

参数

参数描述
function(currentValue, index,arr)必须。函数,数组中的每个元素都会执行这个函数 函数参数见下表
thisValue可选。对象作为该执行回调时使用,传递给函数,用作 "this" 的值。 如果省略了 thisValue ,"this" 的值为 "undefined"
参数描述
currentValue必须。当前元素的值
index可选。当前元素的索引值
arr可选。当前元素属于的数组对象

var ages = [32, 33, 16, 40];

var result = ages.filter(function (age) {
  return age >= 17
})
console.log(result);//输出结果为:[ 32, 33, 40 ]

4.Array.prototype.map()

map() 方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。

注意:map() 不会对空数组进行检测,不会改变原始数组。

语法

array.map(function(currentValue,index,arr), thisValue)

参数和上面一样。

//返回一个数组,数组中元素为原始数组的平方根
var numbers = [4, 9, 16, 25];

var result = numbers.map(function (number) {
  return Math.sqrt(number)
})
console.log(result);//输出结果为:[ 2, 3, 4, 5 ]

5.Array.prototype.forEach()

forEach() 方法用于调用数组的每个元素,并将元素传递给回调函数。

注意:forEach()对于空数组是不会执行回调函数的。

语法

array.forEach(function(currentValue, index, arr), thisValue)

参数

参数描述
function(currentValue, index, arr)必需。 数组中每个元素需要调用的函数。 函数参数见下表
thisValue可选。传递给函数的值一般用 "this" 值。 如果这个参数为空, "undefined" 会传递给 "this" 值
参数描述
currentValue必需。当前元素
index可选。当前元素的索引值。
arr可选。当前元素所属的数组对象。
var numbers = [4, 9, 16, 25];

numbers.forEach(function (number, index) {
  console.log(index + ' -- ' + number);
})
// 0 -- 4
// 1 -- 9
// 2 -- 16
// 3 -- 25


数组去重例子

     // 封装一个去重的函数 unique
        function unique(arr) {
            var newArr = [];
            for (var i = 0; i < arr.length; i++) {
                if (newArr.indexOf(arr[i]) == -1) {
                    newArr.push(arr[i]);
                }
            }
            return newArr;
        }
        var demo = unique(['c', 'a', 'd', 'q', 'c', 'a']);
        console.log(demo);   //['c', 'a', 'd', 'q']

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐