JS数组常用方法---2、push方法使用及原理
一、总结
一句话总结:
push方法的作用是向数组末尾添加一个或多个元素,参数是要push到数组的元素,返回值是数组新的长度,push方法会影响原数组
push方法的原理就是动态的获取传递给push方法的参数,然后依次循环遍历的加到原数组后面
push方法
作用:向数组末尾添加一个或多个元素
参数:element1, ..., elementN
返回值:数组新的长度(length)
是否影响原数组:肯定影响
//简单实现push方法
Array.prototype.push1=function () {
//通过遍历把参数加到原数组里面去
for (let i in arguments){
this[this.length]=arguments[i];
//如果this是对象的话,我们就手动的对这个对象的length属性加1
if(Object.prototype.toString.call(this).slice(8,-1)=='Object'){
this.length++;
}
}
return this.length;
};
1、调用数组方法另外的形式(除了 arr.方法名 外)?
1、Array.prototype.push.apply(vegetables, moreVegs);
2、[].push.call(this, elem);
2、push方法的原理?
push方法的原理就是动态的获取传递给push方法的参数,然后依次循环遍历的加到原数组后面
//简单实现push方法
Array.prototype.push1=function () {
//通过遍历把参数加到原数组里面去
for (let i in arguments){
this[this.length]=arguments[i];
//如果this是对象的话,我们就手动的对这个对象的length属性加1
if(Object.prototype.toString.call(this).slice(8,-1)=='Object'){
this.length++;
}
}
return this.length;
};
二、push方法使用及原理
博客对应课程的视频位置:
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>push方法</title>
6 </head>
7 <body>
8 <!--
9
10 push方法
11 作用:向数组末尾添加一个或多个元素
12 参数:element1, ..., elementN
13 返回值:数组新的长度(length)
14 是否影响原数组:肯定影响
15
16
17 调用数组方法另外的形式(除了 arr.方法名 外)
18 1、Array.prototype.push.apply(vegetables, moreVegs);
19 2、[].push.call(this, elem);
20
21 push方法的原理
22 push方法的原理就是动态的获取传递给push方法的参数,然后依次循环遍历的加到原数组后面
23
24
25 -->
26 <script>
27 //1、push的基本使用
28 // let arr=[1,2,3];
29 // let new_length=arr.push(4);
30 // //arr.push(5,6,7);
31 // console.log(new_length);
32 // console.log(arr);
33
34 //2、合并两个数组
35 // var vegetables = ['parsnip', 'potato'];
36 // var moreVegs = ['celery', 'beetroot'];
37 //
38 // // 将第二个数组融合进第一个数组
39 // // 相当于 vegetables.push('celery', 'beetroot');
40 // Array.prototype.push.apply(vegetables, moreVegs);
41 //
42 // console.log(vegetables);
43 // // ['parsnip', 'potato', 'celery', 'beetroot']
44
45 //3、像数组一样使用对象
46 // var obj = {
47 // length: 0,
48 //
49 // addElem: function addElem (elem) {
50 // // obj.length is automatically incremented
51 // // every time an element is added.
52 // [].push.call(this, elem);
53 // }
54 // };
55 //
56 // // Let's add some empty objects just to illustrate.
57 // obj.addElem({});
58 // obj.addElem({});
59 // console.log(obj.length);
60 // // → 2
61 // console.log(obj);
62
63 //4、简单实现push方法
64 Array.prototype.push1=function () {
65 //console.log(this);
66 //console.log(arguments);
67 //通过遍历把参数加到原数组里面去
68 for (let i in arguments){
69 this[this.length]=arguments[i];
70 //如果this是对象的话,我们就手动的对这个对象的length属性加1
71 if(Object.prototype.toString.call(this).slice(8,-1)=='Object'){
72 this.length++;
73 }
74 }
75 //console.log(this);
76 return this.length;
77 };
78 // let arr=[1,2,3];
79 // let new_length=arr.push1(4,5,6);
80 // //arr.push1(7);
81 // console.log(new_length);
82 // console.log(arr);
83
84
85 //5、合并两个数组(使用我们自己创建的push方法)
86 // var vegetables = ['parsnip', 'potato'];
87 // var moreVegs = ['celery', 'beetroot'];
88 //
89 // // 将第二个数组融合进第一个数组
90 // // 相当于 vegetables.push('celery', 'beetroot');
91 // Array.prototype.push1.apply(vegetables, moreVegs);
92 //
93 // console.log(vegetables);
94 // // ['parsnip', 'potato', 'celery', 'beetroot']
95
96
97 //6、像数组一样使用对象(使用我们自己创建的push方法)
98 // var obj = {
99 // length: 0,
100 //
101 // addElem: function addElem (elem) {
102 // // obj.length is automatically incremented
103 // // every time an element is added.
104 // [].push1.call(this, elem);
105 // }
106 // };
107 //
108 // // Let's add some empty objects just to illustrate.
109 // obj.addElem({});
110 // obj.addElem({});
111 // console.log(obj.length);
112 // // → 2
113 // console.log(obj);
114
115 </script>
116 </body>
117 </html>
来源:oschina
链接:https://my.oschina.net/u/4392886/blog/4266670