javaScript数组方法实现原理浅析

数组 reverse() 方法

定义和用法

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

语法

• array.reverse()

说明

• 该方法会改变原来的数组，返回值为改变后的数组。

现在简单实现reverse()方法的原理

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

Array.prototype.reverseNew = function () {
//先创建一个新数组
var arr = [];
//获取原数组的长度
var len = this.length;
//将原数组倒序的方式赋值给新数组，循环次数为原数组的长度-1，因为索引是从0开始的所以需要-1。
for (var i = len - 1; i >= 0; i--) {
arr.push(this[i]);
}
//通过循环将原数组的数据改为新数组的数据
for (var j = 0; j < arr.length; j++) {
this[j] = arr[j];
}
// 将倒序好的原数组返回
return this;
}
var arr = [1, 2, 3, 6, 7, 8, 9];
console.log(arr.reverseNew());
//[9, 8, 7, 6, 3, 2, 1]
console.log(arr);
// [9, 8, 7, 6, 3, 2, 1]

数组 concat() 方法

定义和用法

• concat() 方法将数多个数组或者元素合并成一个新数组并返回 ，不会修改原数组。

语法

• array. concat(arr1,…)

参数

• 方法的参数可以为一个元素或者数组，也可以是多个元素或者数组。

现在简单实现concat()方法的原理

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32

Array.prototype.concatNew = function () {
//先创建一个新数组
var arr = [];
//通过循环将原数组的数据赋值给新数组
for (var j = 0; j < this.length; j++) {
arr[j] = this[j]
}
// 控制循环的次数为实参的个数
for (var k = 0; k < arguments.length; k++) {
//判断参数类型，如果为数组时
if (typeof arguments[k] == "object") {
// 将当前索引的数组的数据添加到新数组
for (var i = 0; i < arguments[k].length; i++) {
arr.push(arguments[k][i]);
}
}else{
//不是数组就将元素直接添加到新数组中
arr.push(arguments[k]);
}
}
//返回新数组
return arr;
}
var arr1 = [11, 2, 3];
var arr2 = [5, 46, 8];
var arr3 = "哈哈哈";
console.log(arr1.concatNew(arr2, arr3));
// [11, 2, 3, 5, 46, 8, "哈哈哈"]
console.log(arr1);
// [11, 2, 3]

数组 join() 方法

定义和用法

• join() 方法用于把数组中的所有元素拼接成字符串返回 ，不会修改原数组

语法

• array. join(“连接符”)

参数

• 参数可选，参数为空时那么连接符默认为","。

  现在简单实现 join()方法的原理

  复制代码 Array.prototype.joinNew = function () { // 先创建一个空字符串 var str = ""; // 如果有实参时连接符为实参，没有时连接符为默认为","号 var connector = arguments[0] || ","; //通过循环将数组的数据和conneor(连接符)拼接在一起; for (var i = 0; i < this.length; i++) { str += this[i] + connector; } // 最后返回拼接完成好的字符串 return str; } var arr = ["东", "南", "西", "傻"]; console.log(arr.joinNew("瓜 ")); // 东瓜 南瓜 西瓜 傻瓜 console.log(arr); // ["东", "南", "西", "傻"]

  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  15
  16
  17
  18
  19
   Array.prototype.joinNew = function () {
  // 先创建一个空字符串
  var str = "";
  // 如果有实参时连接符为实参，没有时连接符为默认为","号
  var connector = arguments[0] || ",";
  //通过循环将数组的数据和conneor(连接符)拼接在一起;
  for (var i = 0; i < this.length; i++) {
  str += this[i] + connector;
  }
  // 最后返回拼接完成好的字符串
  return str;
  }
  var arr = ["东", "南", "西", "傻"];
  console.log(arr.joinNew("瓜 "));
  // 东瓜 南瓜 西瓜 傻瓜
  console.log(arr);
  //
  ["东", "南", "西", "傻"]
  

最后

以上就是欢呼铅笔最近收集整理的关于javaScript数组方法实现原理浅析的全部内容，更多相关javaScript数组方法实现原理浅析内容请搜索靠谱客的其他文章。