在JavaScript中操作数组之map()方法的使用


Posted in Javascript onJune 09, 2015

 JavaScript 数组map()方法创建一个新的数组使用调用此数组中的每个元素上所提供的函数的结果。
语法

array.map(callback[, thisObject]);

下面是参数的详细信息:

  •     callback : 从当前的元素函数产生新的数组的元素。
  •     thisObject : 对象作为该执行回调时使用

返回值:

返回创建数组
兼容性:

这种方法是一个JavaScript扩展到ECMA-262标准;因此它可能不存在在标准的其他实现。为了使它工作,你需要添加下面的脚本代码在顶部:

if (!Array.prototype.map)
{
 Array.prototype.map = function(fun /*, thisp*/)
 {
  var len = this.length;
  if (typeof fun != "function")
   throw new TypeError();

  var res = new Array(len);
  var thisp = arguments[1];
  for (var i = 0; i < len; i++)
  {
   if (i in this)
    res[i] = fun.call(thisp, this[i], i, this);
  }

  return res;
 };
}

例子:

<html>
<head>
<title>JavaScript Array map Method</title>
</head>
<body>
<script type="text/javascript">
if (!Array.prototype.map)
{
 Array.prototype.map = function(fun /*, thisp*/)
 {
  var len = this.length;
  if (typeof fun != "function")
   throw new TypeError();

  var res = new Array(len);
  var thisp = arguments[1];
  for (var i = 0; i < len; i++)
  {
   if (i in this)
    res[i] = fun.call(thisp, this[i], i, this);
  }

  return res;
 };
}

var numbers = [1, 4, 9];
var roots = numbers.map(Math.sqrt);

document.write("roots is : " + roots ); 

</script>
</body>
</html>

这将产生以下结果:

roots is : 1,2,3
Javascript 相关文章推荐
jQuery contains过滤器实现精确匹配使用方法
Apr 12 Javascript
js去空格技巧分别去字符串前后、左右空格
Oct 21 Javascript
处理文本部分内容的TextRange对象应用实例
Jul 29 Javascript
详解JS函数重载
Dec 04 Javascript
JS解析XML实例分析
Jan 30 Javascript
详解angular用$sce服务来过滤HTML标签
Apr 11 Javascript
微信小程序支付之c#后台实现方法
Oct 19 Javascript
微信小程序 拍照或从相册选取图片上传代码实例
Aug 28 Javascript
Vue-CLI 3 scp2自动部署项目至服务器的方法
Jul 24 Javascript
AngularJs的$http发送POST请求,php无法接收Post的数据问题及解决方案
Aug 13 Javascript
react如何快速设置文件路径别名
Apr 28 Javascript
详解JavaScript中Arguments对象用途
Aug 30 Javascript
JavaScript中join()方法的使用简介
Jun 09 #Javascript
Jquery日期选择datepicker插件用法实例分析
Jun 08 #Javascript
Jquery实现遮罩层的方法
Jun 08 #Javascript
js正则匹配出所有图片及图片地址src的方法
Jun 08 #Javascript
Js数组排序函数sort()介绍
Jun 08 #Javascript
元素绑定click点击事件方法
Jun 08 #Javascript
JavaScript获取URL汇总
Jun 08 #Javascript
You might like
解析php中如何调用用户自定义函数
2013/08/06 PHP
修改Laravel5.3中的路由文件与路径
2016/08/10 PHP
CentOS 上搭建 PHP7 开发测试环境
2017/02/26 PHP
PHP基于imagick扩展实现合成图片的两种方法【附imagick扩展下载】
2017/11/14 PHP
如何实现iframe(嵌入式帧)的自适应高度
2006/07/26 Javascript
Javascript 原型和继承(Prototypes and Inheritance)
2009/04/01 Javascript
用js来解决ajax读取页面乱码
2010/11/28 Javascript
Javascript 正则表达式校验数字的简单实例
2016/11/02 Javascript
Nodejs进阶:基于express+multer的文件上传实例
2016/11/21 NodeJs
js实现带简单弹性运动的导航条
2017/02/22 Javascript
详解axios 全攻略之基本介绍与使用(GET 与 POST)
2017/09/15 Javascript
javaScript字符串工具类StringUtils详解
2017/12/08 Javascript
JavaScript实现删除数组重复元素的5种常用高效算法总结
2018/01/18 Javascript
vue组件实现弹出框点击显示隐藏效果
2020/10/26 Javascript
Webpack中publicPath路径问题详解
2018/05/03 Javascript
Babel 入门教程学习笔记
2018/06/13 Javascript
快速解决bootstrap下拉菜单无法隐藏的问题
2018/08/10 Javascript
VUE项目axios请求头更改Content-Type操作
2020/07/24 Javascript
[03:28]2014DOTA2国际邀请赛 EG战队官方纪录片
2014/07/21 DOTA
从零学Python之入门(三)序列
2014/05/25 Python
Python数组遍历的简单实现方法小结
2016/04/27 Python
python和flask中返回JSON数据的方法
2018/03/26 Python
Python装饰器简单用法实例小结
2018/12/03 Python
Python +Selenium解决图片验证码登录或注册问题(推荐)
2020/02/09 Python
pycharm不以pytest方式运行,想要切换回普通模式运行的操作
2020/09/01 Python
Pycharm的Available Packages为空的解决方法
2020/09/18 Python
美国Lolё官网:购买大胆而美丽的女性运动服装
2017/05/22 全球购物
Orvis官网:自1856年以来,优质服装、飞钓装备等
2018/12/17 全球购物
介绍一下linux的文件系统
2012/03/20 面试题
酒店管理毕业生自我鉴定
2014/03/02 职场文书
家长学校实施方案
2014/03/15 职场文书
社区健康教育实施方案
2014/03/18 职场文书
销售团队获奖感言
2014/08/14 职场文书
个人作风建设剖析材料
2014/10/11 职场文书
事业单位考察材料范文
2014/12/25 职场文书
选购到合适的激光打印机
2022/04/21 数码科技