在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 例外被抛出且未被接住原因介绍
Sep 04 Javascript
jquery单行文字向上滚动效果的实现代码
Sep 05 Javascript
jQuery对象初始化的传参方式
Feb 26 Javascript
jQuery对象与DOM对象之间的相互转换
Mar 03 Javascript
动态加载JavaScript文件的两种方法
Apr 22 Javascript
jQuery EasyUI基础教程之EasyUI常用组件(推荐)
Jul 15 Javascript
javascript的document中的动态添加标签实现方法
Oct 24 Javascript
javaScript和jQuery自动加载简单代码实现方法
Nov 24 jQuery
解决vue的变量在settimeout内部效果失效的问题
Aug 30 Javascript
Node.js之readline模块的使用详解
Mar 25 Javascript
Vue数组响应式操作及高阶函数使用代码详解
Aug 01 Javascript
小程序wx.getUserProfile接口的具体使用
Jun 02 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
CI使用Tank Auth转移数据库导致密码用户错误的解决办法
2014/06/12 PHP
php使用curl详细解析及问题汇总
2016/08/11 PHP
PHP面向对象程序设计类的定义与用法简单示例
2016/12/27 PHP
php基于SQLite实现的分页功能示例
2017/06/21 PHP
Laravel框架实现多个视图共享相同数据的方法详解
2019/07/09 PHP
PHP实现笛卡尔积算法的实例讲解
2019/12/22 PHP
textContent在Firefox下与innerText等效的属性
2007/05/12 Javascript
屏蔽F1~F12的快捷键的js函数
2010/05/06 Javascript
jquery解析xml字符串示例分享
2014/03/25 Javascript
jQuery 回调函数(callback)的使用和基础
2015/02/26 Javascript
jQuery实现径向动画菜单效果
2015/07/17 Javascript
BootStrap table表格插件自适应固定表头(超好用)
2016/08/24 Javascript
Node.js检测端口(port)是否被占用的简单示例
2016/09/29 Javascript
javascript html5轻松实现拖动功能
2017/03/01 Javascript
使用 NodeJS+Express 开发服务端的简单介绍
2017/04/07 NodeJs
vue.js单页面应用实例的简单实现
2017/04/10 Javascript
Angular 通过注入 $location 获取与修改当前页面URL的实例
2017/05/31 Javascript
nodejs操作mongodb的填删改查模块的制作及引入实例
2018/01/02 NodeJs
Vue2.0 事件的广播与接收(观察者模式)
2018/03/14 Javascript
JS中原始值和引用值的储存方式示例详解
2018/03/23 Javascript
通过webpack引入第三方库的方法
2018/07/20 Javascript
JS中类的静态方法,静态变量,实例方法,实例变量区别与用法实例分析
2020/03/14 Javascript
js实现限定区域范围拖拉拽效果
2020/11/20 Javascript
状态机的概念和在Python下使用状态机的教程
2015/04/11 Python
Python连接mysql数据库的正确姿势
2016/02/03 Python
利用Python暴力破解zip文件口令的方法详解
2017/12/21 Python
python利用小波分析进行特征提取的实例
2019/01/09 Python
python多进程并行代码实例
2019/09/30 Python
Tretorn美国官网:瑞典外套和鞋类品牌,抵御风雨
2018/07/19 全球购物
理工大学毕业生自荐信
2013/11/01 职场文书
大龄毕业生求职别忘职业规划
2014/03/11 职场文书
迎新晚会主持词
2014/03/24 职场文书
政协委员个人总结
2015/03/03 职场文书
2016年会开场白台词
2015/06/01 职场文书
浅谈Go语言多态的实现与interface使用
2021/06/16 Golang
CSS文本阴影 text-shadow 悬停效果详解
2022/05/25 HTML / CSS