Js利用prototype自定义数组方法示例


Posted in Javascript onOctober 20, 2017

前言

在开始之前,先给大家介绍下js中使用使用原型(prototype)定义方法的好处

经常在前端面试或是和其他同行沟通是,在谈到构造在JS定义构造函数的方法是最好使用原型的方式:将方法定义到构造方法的prototype上,这样的好处是,通过该构造函数生成的实例所拥有的方法都是指向一个函数的索引,这样可以节省内存。

而本文主要给大家介绍了关于Js利用prototype自定义数组方法的相关内容,分享出来供大家参考学习,下面话不多说了,来一起看看详细的介绍吧。

题目

如何实现下列代码:

[1,2,3,4,5].duplicator(); // [1,2,3,4,5,1,2,3,4,5]

解决方法

使用array的prototype属性,自定义duplicator()方法,js代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>Document</title>
 <style></style>
 <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js" type="text/javascript"></script>
</head>
<body>
 <script>
 Array.prototype.duplicator = function() {
 let s = this.concat(this)
 return s
 }
 let t = [1,2,3,4,5].duplicator()
 console.log(t)
</script>

</body>
</html>

在控制台显示效果如下:

Js利用prototype自定义数组方法示例

注意点

在书写这段代码时Array.prototype.duplicator注意不要添加任何括号,function 内部的this 指代调用这个方法的对象,即array.

总结

以上就是这篇文章的全部内容了,本文还有许多不足,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,如果有疑问大家可以留言交流,谢谢大家对三水点靠木的支持。

Javascript 相关文章推荐
jquery 获取json数据实现代码
Apr 27 Javascript
JavaScript 学习笔记(十五)
Jan 28 Javascript
Jquery.addClass始终无效原因分析
Sep 08 Javascript
简单的js图片轮换代码(js图片轮播)
May 06 Javascript
javascript实现Email邮件显示与删除功能
Nov 21 Javascript
jQuery购物网页经典制作案例
Aug 19 Javascript
微信小程序中页面FOR循环和嵌套循环
Jun 21 Javascript
underscore之Collections_动力节点Java学院整理
Jul 10 Javascript
vue.js声明式渲染和条件与循环基础知识
Jul 31 Javascript
Angular 4.0学习教程之架构详解
Sep 12 Javascript
JavaScript实现二叉树的先序、中序及后序遍历方法详解
Oct 26 Javascript
Vue 中批量下载文件并打包的示例代码
Nov 20 Javascript
js 中rewrap-ajax.js插件实例代码
Oct 20 #Javascript
jQuery访问浏览器本地存储cookie、localStorage和sessionStorage的基本用法
Oct 20 #jQuery
JS 中使用Promise 实现红绿灯实例代码(demo)
Oct 20 #Javascript
用JavaScript做简易的购物车的代码示例
Oct 20 #Javascript
浅谈JS 数字和字符串之间相互转化的纠纷
Oct 20 #Javascript
phantomjs导出html到pdf的方法总结
Oct 19 #Javascript
vue2.0设置proxyTable使用axios进行跨域请求的方法
Oct 19 #Javascript
You might like
php 判断访客是否为搜索引擎蜘蛛的函数代码
2011/07/29 PHP
详解PHP中strlen和mb_strlen函数的区别
2014/03/07 PHP
PHP函数extension_loaded()用法实例
2015/01/19 PHP
PHP设计模式之工厂模式定义与用法详解
2018/04/03 PHP
phpcmsv9.0任意文件上传漏洞解析
2020/10/20 PHP
js实现从数组里随机获取元素
2015/01/12 Javascript
JQuery中$.each 和$(selector).each()的区别详解
2015/03/13 Javascript
JavaScript获取页面中表单(form)数量的方法
2015/04/03 Javascript
js实现iPhone界面风格的单选框和复选框按钮实例
2015/08/18 Javascript
使用jQuery的easydrag插件实现可拖动的DIV弹出框
2016/02/19 Javascript
javascript this详细介绍
2016/09/19 Javascript
微信小程序 wx.request(OBJECT)发起请求详解
2016/10/13 Javascript
Bootstrap模态框(Modal)实现过渡效果
2017/03/17 Javascript
详解vue.js全局组件和局部组件
2017/04/10 Javascript
微信小程序开发之toast等弹框提示使用教程
2017/06/08 Javascript
详解微信小程序中的页面代码中的模板的封装
2017/10/12 Javascript
利用Javascript开发一个二维周视图日历
2017/12/14 Javascript
Vue下路由History模式打包后页面空白的解决方法
2018/06/29 Javascript
从Vuex中取出数组赋值给新的数组,新数组push时报错的解决方法
2018/09/18 Javascript
用vuex写了一个购物车H5页面的示例代码
2018/12/04 Javascript
JavaScript使用localStorage存储数据
2019/09/25 Javascript
记一次react前端项目打包优化的方法
2020/03/30 Javascript
微信小程序淘宝首页双排图片布局排版代码(推荐)
2020/10/29 Javascript
[01:12:08]LGD vs OG 2019国际邀请赛淘汰赛 胜者组 BO3 第一场 8.24
2019/09/10 DOTA
简单讲解Python中的闭包
2015/08/11 Python
Python实现Youku视频批量下载功能
2017/03/14 Python
python 如何快速找出两个电子表中数据的差异
2017/05/26 Python
Python字符串逆序输出的实例讲解
2019/02/16 Python
Python collections.defaultdict模块用法详解
2020/06/18 Python
CSS实现鼠标滑过鼠标点击代码写法
2016/12/26 HTML / CSS
苹果音乐订阅:Apple Music
2018/08/02 全球购物
德国高尔夫商店:Golfshop.de
2019/06/22 全球购物
英国运动风奢侈品购物网站:Maison De Fashion
2020/08/28 全球购物
十八届三中全会个人学习材料
2014/02/13 职场文书
《蟋蟀的住宅》教学反思
2016/02/17 职场文书
JS数组的常用方法整理
2021/03/31 Javascript