在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 相关文章推荐
js 如何实现对数据库的增删改查
Nov 23 Javascript
解析JavaScript中的标签语句
Jun 19 Javascript
JQuery1.8 判断元素是否绑定事件的方法
Jul 10 Javascript
JavaScript编写简单的计算器
Nov 25 Javascript
如何实现json数据可视化详解
Nov 24 Javascript
jQuery时间日期三级联动(推荐)
Nov 27 Javascript
JavaScript获取服务器端时间的方法
Nov 29 Javascript
angular使用bootstrap方法手动启动的实例代码
Jul 18 Javascript
浅谈JavaScript的innerWidth与innerHeight
Oct 12 Javascript
Vue如何实现响应式系统
Jul 11 Javascript
小程序input数据双向绑定实现方法
Oct 17 Javascript
vue+ts下对axios的封装实现
Feb 18 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 strstr查找字符串中是否包含某些字符的查找函数
2010/06/03 PHP
深入PHP操作MongoDB的技术总结
2013/06/02 PHP
php ios推送(代码)
2013/07/01 PHP
PHP链表操作简单示例
2016/10/15 PHP
由php中字符offset特征造成的绕过漏洞详解
2017/07/07 PHP
PHP性能分析工具xhprof的安装使用与注意事项
2017/12/19 PHP
PHP如何通过date() 函数格式化显示时间
2020/11/13 PHP
完美解决JS中汉字显示乱码问题(已解决)
2006/12/27 Javascript
multiSteps 基于Jquery的多步骤滑动切换插件
2011/07/22 Javascript
可选择和输入的下拉列表框示例
2013/11/05 Javascript
jQuery和AngularJS的区别浅析
2015/01/29 Javascript
Shell脚本实现Linux系统和进程资源监控
2015/03/05 Javascript
APP中javascript+css3实现下拉刷新效果
2016/01/27 Javascript
js获取时间精确到秒(年月日)
2016/03/16 Javascript
JavaScript自学笔记(必看篇)
2016/06/23 Javascript
JS实现的合并两个有序链表算法示例
2019/02/25 Javascript
详解关于JSON.parse()和JSON.stringify()的性能小测试
2019/03/14 Javascript
js实现课堂随机点名系统
2019/11/21 Javascript
在vue中created、mounted等方法使用小结
2020/07/21 Javascript
element-ui 弹窗组件封装的步骤
2021/01/22 Javascript
[01:07]2015国际邀请赛 中国区预选赛精彩回顾
2015/06/15 DOTA
python设计模式大全
2016/06/27 Python
python绘制随机网络图形示例
2019/11/21 Python
sklearn+python:线性回归案例
2020/02/24 Python
使用python实现微信小程序自动签到功能
2020/04/27 Python
python的reverse函数翻转结果为None的问题
2020/05/11 Python
意大利在线大学图书馆:Libreria universitaria
2019/07/16 全球购物
财务工作者先进事迹材料
2014/01/17 职场文书
计算机实训报告范文
2014/11/05 职场文书
公务员政审材料
2014/12/23 职场文书
史上最牛的辞职信
2015/02/28 职场文书
4S店销售内勤岗位职责
2015/04/13 职场文书
2016年优秀党员教师先进事迹材料
2016/02/29 职场文书
Html5新增了哪些功能
2021/04/16 HTML / CSS
python ansible自动化运维工具执行流程
2021/06/24 Python
Windows7下FTP搭建图文教程
2022/08/05 Servers