关闭

JavaScript push() 方法详解

时间: 2018-10-25阅读: 21515标签: 函数

push定义和用法

push() 方法主要用于向数组的末尾添加一个或多个元素,其返回值为添加后新的长度,即push后的数组长度,该值为number类型。

注意:

1.一定是在数组的末尾添加
2.该方法会改变原数组的长度
3.如果需要在数组起始位置添加元素请使用 unshift() 方法


push函数语法

str.push(newele1,newele2,....,neweleX)

参数值说明:

参数描述
newele1必需。要添加到数组的第一个元素。
newele2可选。要添加到数组的第二个元素。
neweleX可选。可添加多个元素。


说明

push() 方法是把它的参数按顺序进行添加到原数组的尾部,它直接修改了原数组的长度,并不会创建一个新的数组;利用push实现数组进栈功能,出栈可以使用pop方法。


实例

1.一个数组中添加新元素 :

var arr=['红','橙','黄'];
var result=arr.push('绿','蓝');
console.log(arr);//输出arr数组内容:["红", "橙", "黄", "绿", "蓝"]
console.log(result);//输出push返回的结果:5
console.log(typeof result);//结果类型:number


2.小技巧,把一个数组的值赋值到另一个数组上:

var arr1=['红','橙','黄'];
var arr2=[];
arr2.push(...arr1);//这样arr1中的值就赋值给了arr2上了
console.log(arr2);//输出:["红", "橙", "黄"]

备注:这里使用了es6的扩展运算符(...),它主要是将一个数组转为用逗号分隔的参数序列。console.log(...[ '红','橙','黄'  ])等价于:console.log('红','橙','黄'  )


3.高级知识,在对象中使用push

a:在对象中需要添加push的属性,其值为数组原型链的push方法,如下:

var obj = {
   name:'fly63',   
   push:Array.prototype.push
};
obj.push('测试');
console.log(obj[0]);//输出:测试
console.log(obj);//输出:{0: "测试", name: "fly63", length: 1, push: ƒ}
console.log(obj.length);//输出:1,对象默认是没有length属性的,这里使用了push方法,则会创建一个length属性

备注:这里push进去的值默认为第一个,这是由于push是根据 length 属性来决定从哪里开始插入给定的值,上述例子中并未声明length属性,则会创建length属性。验证一下:

var obj = {
   name:'fly63',  
   length:2,//'2'也可以,只有length能被转换为数值即可
   push:Array.prototype.push
};
obj.push('测试');
console.log(obj[2]);//输出:测试
console.log(obj);//输出:{2: "测试", name: "fly63", length: 3, push: ƒ}

由此可见:push会根据对象length属性的值去确定插入的位置,当length不存在,或者不能被转为一个数值的时候,则插入的元素索引默认为 0


b.利用call() 或 apply() ,如下:

var obj = {
   name:'fly63', 
};
Array.prototype.push.call(obj,'测试');
//或者Array.prototype.push.apply(obj,['测试']);
console.log(obj[0]);//测试

call和apply的不懂的请点这个链接。[地址:http://www.fly63.com/article/detial/450]


完结~~~~~~~~

站长推荐

1.云服务推荐: 国内主流云服务商,各类云产品的最新活动,优惠券领取。地址:阿里云腾讯云华为云

2.广告联盟: 整理了目前主流的广告联盟平台,如果你有流量,可以作为参考选择适合你的平台点击进入

链接: http://www.fly63.com/article/detial/1187

关闭

Js函数的扩展

篇文章主要介绍了函数的扩展,函数的扩展只要有三个方面:参数的默认值,箭头函数.关于尾调用的优化;1:参数的默认值(会形成一个单独的作用域)

Js中的函数使用方法

什么是函数,就是把一段相对独立的具有特定功能的代码块封装起来,形成一个独立实体,就是函数,起个名字(函数名),在开发中可以反复调用,函数的作用就是封装一段代码,可以重复使用。

如何实现 lodash.get 函数及可选链操作简化取值

lodash 基本上成为了 js 项目的标配工具函数,广泛应用在各种服务端以及前端应用中,但是它的包体积略大了一些。对于服务端来说,包的体积并不是十分的重要,或者换句话说,不像前端那样对包的体积特别敏感,一分一毫都会影响页面打开的性能,从而影响用户体验。

JavaScript中的高阶函数

在 JavaScript 的学习过程中,我们可能或多或少地接触过高阶函数。那么,我们自己对此是否有一个明确的定义,或者说很熟练的掌握这些用法呢

js中sort函数用法总结_sort排序算法原理

js中sort方法用于对数组的元素进行排序,并返回数组。默认排序顺序是根据字符串Unicode码点。如果要得到自己想要的结果,不管是升序还是降序,就需要提供比较函数了。该函数比较两个值的大小,然后返回一个用于说明这两个值的相对顺序的数字

ES6中箭头函数

ES6 允许使用“箭头”(=>)定义函数。如果箭头函数不需要参数或需要多个参数,就使用一个圆括号代表参数部分。函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象。

a标签调用js函数写法总结

这是常用的方法,但是这种方法在传递this等参数的时候很容易出问题,而且javascript:协议作为a的href属性的时候不仅会导致不必要的触发window.onbeforeunload事件,在IE里面更会使gif动画图片停止播放。

玩转Js函数式编程

最近和一些同学讨论了函数式编程,很多同学总觉得听起来很高大上,但用起来却无从下手。于是我抽时间捋了捋,将平时工作中用到的函数式编程案例和思想整理了出来

Js Function函数深入总结

整理了JavaScript中函数Function的各种,感觉函数就是一大对象啊,各种知识点都能牵扯进来,不单单是 Function 这个本身原生的引用类型的各种用法,还包含执行环境,作用域,闭包,上下文,私有变量等知识点的深入理解。

js中浏览器兼容startsWith 、endsWith 函数

在做js开发的时候用到了startsWith函数时,发现各个浏览器不兼容问题,因为对开发来说,chrome浏览器最好用,就一直在chrome浏览器中使用这两个函数没有任何问题,但在ie浏览器访问就直接报错,因为ie没有这两个函数,要么修改方法,换别的方法,但是一两个还好改,多了就不好改

点击更多...

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!