复习数组

发表于 | 分类于 |

可以先看一下这里的总结👉点击

数组创建方法

  • 字面量定义方法

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

  • new Array

    1
    2
    3
    var arr = new Array(10);//创建了长度为10的稀松数组，值都为undefined
    var arr = new Array(1,2,3,4); //创建了数组[1,2,3,4]
    var arr = new Array(10.2)//报错，长度不能为小数



常用方法

【会改变原数组的方法】

  • push

  • pop

  • shift

  • unshift

  • reverse

  • splice

  • sort

【不会改变原数组的方法】

  • concat
  • join
  • slice
  • toString
  • join，返回字符串
  • String.split，这个不是数组的方法，它是字符串的方法。返回数组 join和split互逆

数组和字符串之间的相互转换就可以使用join和split

1570956573946

手写push方法：

1
2
3
4
5
6
7
8
9
10
11
12
13
var arr = [1, 2, 3, 4];
Array.prototype.push = function () {
  for (var i = 0; i < arguments.length; i++) {
    this[this.length] = arguments[i];
  }

  return this.length + "  我是手写的push";
}
console.log(arr);
console.log(arr.push(5));
console.log(arr);
console.log(arr.push(6, 7, 8));
console.log(arr);


这个splice我要特别记一下，他是这样子的👇

arr.splice(从第几位开始，截取多少的长度，在切口处添加新数据)

这个位数的判断很微妙，这里特别说一下，之前一直理解错

1570954253675

1570954293519

如果是splice(-1)表示从倒数第一位置开始切。


sort不能直接使用，要传入一个函数。

1
2
3
4
5
6
7
8
9
var arr = [1, 2, 10, 4];
arr.sort(function (a, b) {
  if (a > b) {
    return 1;
  } else {
    return -1;
  }
})
console.log(arr);

以上是升序排序。

可以再简化一下：

1
2
3
4
arr.sort(function (a, b) {
  return a - b;//升序
//return b - a;//降序
})

练练👇：

1
2
3
4
5
6
// 给定一个有序的数组，使其乱序
var arr = [1, 2, 3, 4, 5];
arr.sort(function (a, b) {
  return Math.random() - 0.5;
})
console.log(arr);
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
//对象数组的排序
var aaa = {
  age: 12,
  name: 'AAA'
},
  bbb = {
    age: 20,
    name: 'BBB'
  },
  ccc = {
    age: 6,
    name: 'CCC'
  }

var arr = [aaa, bbb, ccc];
arr.sort(function (a, b) {
  return a.age - b.age
});

console.log(arr);


1570956085353


slice方法

slice（从该位开始截取，截取到该位），返回出截取出来的数组



类数组

举个栗子，arguments就是个类数组。

手写一个类数组：

1
2
3
4
5
6
7
var obj = {
  "0": 'a',
  "1": 'b',
  "2": 'c',
  "length": 3,
  "push": Array.prototype.push
}

1570957073803

💡类数组：属性要为索引（数字）属性，必须有length属性，最好加上push方法。而且如果加上splice方法的话，外观就更像数组了👇

1
2
3
4
5
6
7
8
var obj = {
  "0": 'a',
  "1": 'b',
  "2": 'c',
  "length": 3,
  "push": Array.prototype.push,
  "splice": Array.prototype.splice
}

1570957380785

阿里巴巴笔试题👇

1
2
3
4
5
6
7
8
9
10
11
// 运行以下代码，问obj变成了什么样？

var obj = {
  "2": 'a',
  "3": 'b',
  "length": 2,
  "push": Array.prototype.push,
  "splice": Array.prototype.splice
}
obj.push('c');
obj.push('d');

1570957532671

这里看一下push的原理就懂了，我上文有写👆


【封装typeof】

使其可以准确判断类型

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
function _type(target) {
  var template = {
    "[object Array]": "array",
    "[object Object]": "object",
    // 下面三个包装类
    "[object Number]": "number - object",
    "[object Boolean]": "boolean - object",
    "[object String]": "string - object",
  }

  if (target == null) {
    return null;
  }

  if (typeof (target) == 'object') {
    var str = Object.prototype.toString.call(target);
    return template[str];
  } else {
    return typeof (target);//原始值和Function可以直接通过原生typeof判断
  }
}


【数组去重】

方法一：利用对象属性的唯一性

1
2
3
4
5
6
7
8
9
10
11
12
13
14
Array.prototype.unique = function () {
  var temp = {};
  var arr = [];
  var len = this.length;
  for (var i = 0; i < len; i++) {
    if (!temp[this[i]]) {
      temp[this[i]] = "abc";
      arr.push(this[i])
    }
  }
  return arr;
}
   
console.log(arr.unique());

方法二：利用ES6的[..new Set(arr)]或者Array.from(new Set(arr))

1
2
3
4
5
6
7
8
9
10
11
12
var arr = [1, 2, 4, 5, 6, 4, 2,];

function unique(arr) {
  if (!Array.isArray(arr)) {
    console.log('type error!')
    return
  }
  return [...new Set(arr)];
  //return Array.from(new Set(arr))  
}

console.log(unique(arr));

方法三： 双循环

双重for（或while）循环是比较笨拙的方法，它实现的原理很简单：先定义一个包含原始数组第一个元素的数组，然后遍历原始数组，将原始数组中的每个元素与新数组中的每个元素进行比对，如果不重复则添加到新数组中，最后返回新数组；因为它的时间复杂度是O(n^2)，如果数组长度很大，那么将会非常耗费内存

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
function unique(arr) {
    if (!Array.isArray(arr)) {
        console.log('type error!')
        return
    }
    let res = [arr[0]]
    for (let i = 1; i < arr.length; i++) {
        let flag = true
        for (let j = 0; j < res.length; j++) {
            if (arr[i] === res[j]) {
                flag = false;//利用一个flag来判断是否已存在，关键
                break
            }
        }
        if (flag) {
            res.push(arr[i])
        }
    }
    return res
}

方法四：indexOf方法

数组的indexOf()方法可返回某个指定的元素在数组中首次出现的位置。该方法首先定义一个空数组res，然后调用indexOf方法对原来的数组进行遍历判断，如果元素不在res中，则将其push进res中，最后将res返回即可获得去重的数组

1
2
3
4
5
6
7
8
9
10
11
12
13
function unique(arr) {
    if (!Array.isArray(arr)) {
        console.log('type error!')
        return
    }
    let res = []
    for (let i = 0; i < arr.length; i++) {
        if (res.indexOf(arr[i]) === -1) {
            res.push(arr[i])
        }
    }
    return res
}



来点随堂练习👇：

1
2
3
4
(function (x) {
  delete x;
  return x;
})(1)

结果为1。

1
2
3
4
5
6
(function (x) {
  // 形参实际上就是隐式地执行了 var x;
  // 同时注意，var出来的变量，如果不是作为属性而存在的话，是无法被delete掉的
  delete x;//无效
  return x;//该是啥就是啥
})(1)
1
2
3
4
var h = function a() {
  return 23;
}
console.log(typeof a());//Uncaught ReferenceError: a is not defined