文章详情

短信预约-IT技能 免费直播动态提醒

请输入下面的图形验证码

提交验证

短信预约提醒成功

在jquery中有没有map方法

2024-04-02 19:55

关注

这篇“在jquery中有没有map方法”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“在jquery中有没有map方法”文章吧。

jquery中有map()方法。map()方法用于使用指定回调函数处理数组的每个元素(或对象的每个属性),并将处理结果封装为新数组返回,语法“$.map(数组或对象,回调函数)”。map()方法会为回调函数传入两个参数:第一个参数为当前迭代的元素或属性值,第二个参数为当前迭代项的数组索引或对象属性名;如果回调函数的返回值为null或undefined,则不会被添加到结果数组中。

在jquery中有没有map方法

本教程操作环境:windows7系统、jquery3.6.0版本、Dell G3电脑。

jquery中有map()方法。

在jquery中,map()方法用于使用指定回调回调函数处理数组的每个元素(或对象的每个属性),并将处理结果封装为新数组返回。

注意:1. 在jQuery 1.6 之前,该函数只支持遍历数组;从 1.6 开始,该函数也支持遍历对象。

语法格式:

$.map( object, callback )
参数描述
objectArray/Object类型   指定的需要处理的数组或对象。
callbackFunction类型    指定的处理函数。

map()会为回调函数传入两个参数:其一是当前迭代的元素或属性值,其二是当前迭代项的数组索引或对象属性名。

回调函数返回值将作为结果数组中的一个元素,如果返回值为null或undefined,则不会被添加到结果数组中。

示例:使用$.map() 修改一个数组的值

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<style>
			div { color:blue; }
			p { color:green; margin:0; }
			span { color:red; }
		</style>
		<script src="./js/jquery-3.6.0.min.js"></script>
	</head>
	<body>

		<div></div>
		<p></p>
		<span></span>
		<script>
			$(function() {
				var arr = ["a", "b", "c", "d", "e"];
				$("div").text(arr.join(", "));
				arr = $.map(arr, function(n, i) {
					return (n.toUpperCase() + i);
				});
				$("p").text(arr.join(", "));
				arr = $.map(arr, function(a) {
					return a + a;
				});
				$("span").text(arr.join(", "));
			})
		</script>

	</body>
</html>

在jquery中有没有map方法

扩展知识

map方法可以遍历数组,那么可不可以遍历伪数组?那让我们直接看代码吧!

在jquery中有没有map方法

在jquery中有没有map方法




显然是可以的,和jQuery中的each方法一样看,map方法也可以遍历伪数组

既然jQuery中的each和map方法都可以遍历数组和伪数组,那么它们之间又有什么区别?

1、each方法默认的返回值是遍历谁就返回谁

2、map方法默认的返回值是一个空数组

在jquery中有没有map方法

在jquery中有没有map方法

1、each方法不支持在回调函数中对遍历的数组进行处理

2、map方法可以在回调函数中通过return对遍历的数组进行处理,然后生成一个新的数组返回

在jquery中有没有map方法

在jquery中有没有map方法

可以看到map方法返回的数组是索引加上索引对应的值,所以说map方法是可以通过return对遍历的数组进行处理,然后生成一个新的数组返回

在jquery中有没有map方法

在jquery中有没有map方法


而each是不支持通过return在回调函数中对遍历的数组进行处理

以上就是关于“在jquery中有没有map方法”这篇文章的内容,相信大家都有了一定的了解,希望小编分享的内容对大家有帮助,若想了解更多相关的知识内容,请关注编程网行业资讯频道。

阅读原文内容投诉

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

软考中级精品资料免费领

  • 历年真题答案解析
  • 备考技巧名师总结
  • 高频考点精准押题
  • 2024年上半年信息系统项目管理师第二批次真题及答案解析(完整版)

    难度     813人已做
    查看
  • 【考后总结】2024年5月26日信息系统项目管理师第2批次考情分析

    难度     354人已做
    查看
  • 【考后总结】2024年5月25日信息系统项目管理师第1批次考情分析

    难度     318人已做
    查看
  • 2024年上半年软考高项第一、二批次真题考点汇总(完整版)

    难度     435人已做
    查看
  • 2024年上半年系统架构设计师考试综合知识真题

    难度     224人已做
    查看

相关文章

发现更多好内容

猜你喜欢

AI推送时光机
位置:首页-资讯-前端开发
咦!没有更多了?去看看其它编程学习网 内容吧
首页课程
资料下载
问答资讯