前端数组的基本操作

既然讲到了数组，那就必须想到了数组的增删改查。那就首先讲数组的增删改查。

1.增删改查

1>删 

shift()

删除数组的第一个元素并返回删除的元素（改变原数组）

pop()

删除数组的最后一个元素并返回删除的元素（改变原数组）

splice()

删除元素，并向数组添加新元素。（改变原数组）

var arr= [0, 1, 2, 3, 4, 5]

var f1= arr.shift();

console.log(f1);// 0

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

............................................................

var arr= [0, 1, 2, 3, 4, 5]

var f2= arr.pop();//5

console.log(f2);// [0, 1, 2, 3, 4]

.............................................................

var arr= [0, 1, 2, 3, 4, 5]

var f3= arr.splice(2,1);//“2”从下标为2开始，“1”删除一个  splice(index,howmany,[item])

console.log(f3);// [2]

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

.............................................................................

方法1：构造函数进行删除数组中的元素（splice（））

function remove(arr, val) {
   for (var i = 0; i < arrq.length; i++) {
        if (arr[i] == val) {
            arr.splice(i, 1);
            break;
        }
   }
}
var somearray = ["mon", "tue", "wed", "thur"]
removeByValue(somearray, "wed"); 
console.log(somearray);// ["mon", "tue", "thur"]

方法2：数组对象增加相应的的方法删除（splice（））

Array.prototype.remove = function(val) {
   for (var i = 0; i < this.length; i++) {
       if (this[i] == val) {
           this.splice(i, 1);
           break;
       }
   }
}
var somearray = ["mon", "tue", "wed", "thur"]
somearray.remove("tue");
console.log(somearray);//["mon", "wed", "thur"]

方法3：通过元素的索引去删除这个元素(indexOf(),splice())

Array.prototype.remove = function(val) { 
    var index = this.indexOf(val); 
    if (index > -1) { 
        this.splice(index, 1); 
    } 
}; 
var arr = ['abd', 'abd', 'abe', 'abf']
arr.remove('abd');
console.log(arr);//["abd", "abe", "abf"]

方法4：使用delete删除，数组长度不变，有一项为undefined

var arr = [1, 2, 3, 4, 5]；
delete arr[1];//删除数组中下标为1的项目，代替为undefined
console.log(arr); //[1, empty, 3, 4, 5]

2>增

push()

向数组的末尾添加一个或更多元素，并返回新的长度。（改变原数组）

unshift()

向数组的开头添加一个或更多元素，并返回新的长度。（改变原数组）

splice()

删除元素，并向数组添加新元素。（改变原数组）不能为负数

 var arr = [1, 2, 3, 4, 5, 6]
 var f5 = arr.push('a', 'b');
 console.log(f5); //8
 console.log(arr); // [1, 2, 3, 4, 5, 6, "a", "b"]

.....................................................................................

var arr = [1, 2, 3, 4, 5, 6]

var f5 = arr.unshift('a', 'b'); 

console.log(f5); //8

console.log(arr); // [1, 2, 3, 4, 5, 6, "a", "b"]

...........................................................................................

var arr = [1, 2, 3, 4, 5, 6]

var f5 = arr.splice(2,0,'a', 'b'); //从下标为2开始，删除0个，向其中添加一个或多个

console.log(arr); // [1, 2, "a", "b", 3, 4, 5, 6]

3>查

slice()

从某个已有的数组返回选定的元素(不改变原数组）。splice（start，end);值可以为负数

indexOf()

返回某个指定的字符串值在字符串中首次出现的位置的下标。

var arr = ['a', 'b', 'c', 'd','a'];

var f2 = arr.indexOf('a');

console.log(f2);//0

var f3=arr.indexOf('a',2);

console.log(f3);//4 从下标为2开始查找 ‘a’,找到则输出‘a'的下标

var f4 = arr.slice(2, 4)；//从数组中找到下标值以，开头->结尾，输出你中间项（可以为负数：-1为倒数第一，-2为倒数第二）

console.log(f4); //

方法1：使用函数判断取得下标

function search(arr, item) {
   var index = -1; // 先定义一个下标
      arr.forEach(function(res, i) { // 元素  下标
        if (res === item && index === -1) {
            index = i;
        }
     );
  return index;
};
var arr = [1, 2, 3, 4, 5, 6];
var f5 = search(arr, 4)
console.log(f5);//3

方法2：简单的写法 ,在支持indexOf的浏览器运行

function search(arr,item) {
    return arr.indexOf(item); // 直接返回index下标
}     
var arr = [1, 2, 3, 4, 5, 6];
var f5 = search(arr, 4);
console.log(f5);//3

方法3：在数组中查找所有出现的x，并返回一个包含匹配索引的数组

function findall(arr, x) {
    var results = [],
    len = a.length,
    pos = 0;
    while (pos < len) {
        pos = a.indexOf(x, pos);
        if (pos === -1) { //未找到就退出循环完成搜索
           break;
        }
        results.push(pos); //找到就存储索引
        pos += 1; //并从下个位置开始搜索
    }
    return results;
}

var arr = [1, 2, 3, 1, 4, 1, 4, 1];
var f1=findall(arr, 1); //返回[0,3,5,7]
console.log(f1);//[0, 3, 5, 7]

4>改

splice()

删除元素，并向数组添加新元素。（改变原数组）

var arr = ['a', 'b', 'c', 'd', 'a'];

arr.splice(1, 2, "f", "h");

console.log(arr);//["a", "f", "h", "d", "a"]

2.常用的其他方式操作数组

sort()

对数组的元素进行排序.(返回新数组）

reverse()

颠倒数组中元素的顺序。(返回新数组）

valueOf()

返回数组对象的原始值

toSource()

返回该对象的源代码。

toLocaleString()

把数组转换为本地数组，并返回结果。(常用与本地时间转换）

var arr = [1, 2, 5, 4, 8, 9, 6];

var f1 = arr.sort();

console.log(f1);//[1, 2, 4, 5, 6, 8, 9]

var f2 = f1.reverse();

console.log(f2);//[9, 8, 6, 5, 4, 2, 1]

var f3 = arr.valueOf();

console.log(f3)//9, 8, 6, 5, 4, 2, 1]

var date = new Date();

var f4 = date.toLocaleString();

console.log(f4)//2018/9/5 下午11:56:36

3.数组转字符串操作

join()

用指定分隔符将数组分割成字符串并返回，默认为逗号分割。

toString()

将数组转化为字符串

var arr = [1, 2, 5, 4, 8, 9, 6];

var f1 = arr.join();

console.log(f1);//9,8,6,5,4,2,1

var f2 = arr.toString();

console.log(f2);//9,8,6,5,4,2,1

4.字符串转数组的操作

split()

将字符串以某个符号分割成字符串，并返回以数组的形式展示。（必须要加默认分割符）

var str = 'abcdefg';

var f 1=str.split('');

console.log(f1)；//["a", "b", "c", "d", "e", "f", "g"];

在这里感谢大家，希望大家多多支持。点波关注再走吧，如果帮到你了，也可以给个赞哦。
版权声明：版权所有，转载请注明原址。 https://blog.csdn.net/weixin_41316842/article/details/82421864