JavaScript中通过原型扩展实现数组Contains方法

作者:小括号

时间:2026-10-27

浏览:212

本文介绍如何在JavaScript中实现类似C#的Contains方法。通过扩展Array.prototype,自定义遍历逻辑判断数组是否包含指定元素,并结合jQuery示例演示在单选框状态匹配中的实际应用,同时提供简化数组初始化的代码写法。

文章目录

JavaScript数组Contains方法的实现原理

在C#语言中,判断集合是否包含特定元素通常使用Contains方法。然而,在JavaScript环境中,原生数组并不直接提供此方法,因此需要寻找替代方案来解决这一常见问题。


可以通过JavaScript的原型链机制,对内置对象进行扩展,从而封装并添加自定义的Contains功能。



代码实现与jQuery应用示例

具体的JavaScript实现代码如下:


代码示例如下:

 
<script type="text/javascript">
$(function () {
Array.prototype.contains = function (element) { //利用Array的原型prototype点出一个我想要封装的方法名contains
for (var i = 0; i < this.length; i++) {
if (this[i] == element) { //如果数组中某个元素和你想要测试的元素对象element相等,则证明数组中包含这个元素,返回true
return true;
} 
} 
} 
//用一个例子来验证一些我们封装的方法
var $subCategoryID = $("#hidSubCategory").val();
var $subCategoryIDs = new Array(); //构造一个数组对象
$subCategoryIDs = $subCategoryID.split(","); //为数组赋值
$("input[type=radio]").each(function () {
if ($subCategoryIDs.contains($(this).attr("id"))) { //利用contains方法判断数组中是否含有$(this).attr("id")
$(this).attr("checked", true);
} 
}) 
}) 
</script>

代码简化与优化建议

经过验证,使用Contains方法的数组对象无需显式声明中间变量。上述代码中的相关部分可以简化为更紧凑的写法:


简化后的代码如下:

 
var $subCategoryID = $("#hidSubCategory").val().split(",");

实用工具推荐

电子包浆

绿化、压缩、噪点和虚拟水印,自由调节做旧程度。

使用 ›
图片压缩

选择画质和输出格式,预览压缩前后的大小。

使用 ›
相关文章