JavaScript中扩展Array contains方法实例


Posted in Javascript onAugust 23, 2020

首先三水点靠木小编先为大家分享一个比较好用的代码

Array.prototype.contains = function (a)
{
  if ("string" == typeof a || "number" == typeof a) {
    for (var b in this) {
      if (a == this [b]) {
        return!0;
      };
    }
  }
  return!1
};

先判断传入的参考是字符与数字才可以判断,这样就比较精准。

下面是一些推荐资料可以看看

javascript的Array没有contains方法,有时候这会不方便,contains方法实现很简单:

function contains(a, obj) {
 var i = a.length;
 while (i--) {
  if (a[i] === obj) {
   return true;
  }
 }
 return false;
}

当然我们也可以扩展Array类,如下js

Array.prototype.contains = function(obj) {
 var i = this.length;
 while (i--) {
  if (this[i] === obj) {
   return true;
  }
 }
 return false;
}

这样就可以方便的使用contains方法了:

alert([1, 2, 3].contains(2)); // => true
alert([1, 2, 3].contains('2')); // => false

下面是三水点靠木小编整理的几种方法

一个小误区 JS中的contains

在Java语言中,contains可以用于判断str1是否包含str2

原生JS中是有contains方法的

结构与测试代码如下

<div id="div1">
<div id="div2">
3water.com
</div>
</div>
<script type="text/javascript">
var div1= document.getElementById("div1");
var div2= document.getElementById("div2");
console.log(div1.contains(div2));

var str1="3water.com";
var str2="3water";
console.log(str1.contains(str2));
</script>

JavaScript中扩展Array contains方法实例

但它并不是字符串方法,,仅用于判断DOM元素的包含关系,参数是Element类型

JavaScript中扩展Array contains方法实例

若要在JS中判断俩字符串的包含关系,用indexOf()

JavaScript中扩展Array contains方法实例

但是我们可以通过扩展的方法来实现

<div id="div1">
<div id="div2">
3water.com
</div>
</div>
<script type="text/javascript">
var div1= document.getElementById("div1");
var div2= document.getElementById("div2");
console.log("div1.contains(div2)="+div1.contains(div2));

//字符扩展contains就不会报错了
String.prototype.contains = function(a) {
 return - 1 < this.indexOf(a)
};

var str1="3water.com";
var str2="3water";
console.log("str1.contains(str2)="+str1.contains(str2));

//数组扩展contains适用于数组判断
Array.prototype.contains = function(a) {
 if ("string" == typeof a || "number" == typeof a) for (var b in this) if (a == this[b]) return ! 0;
 return ! 1
};

var arr1=["3water.com","jbzj.com","3water.com"];
var str3="3water.com";
console.log("arr1.contains(str3)="+arr1.contains(str3));
</script>

下面是运行结果

JavaScript中扩展Array contains方法实例

当然也有通过正则实现的JS扩展Array,添加contains方法

Array.prototype.contains = function(item){
 return RegExp("\\b"+item+"\\b").test(this);
};

直接返回true/false

JS判断Array数组中是否包含指定元素

1.调用方式:

var arr=["a","b"];
alert(arr.in_array("a"))

2.JS判断数组是否包含指定元素方法定义:

Array.prototype.contains = function(obj) {
  var i = this.length;
  while (i--) {
    if (this[i] === obj) {
      return true;
    }
  }
  return false;
}
或
Array.prototype.contains = function(element) {
  for (var i = 0; i < this.length; i++) {
    if (this[i] == element) {
      return true;
    }
  }
  return false;
}
或
Array.prototype.in_array = function(e) {
  for(i=0; i<this.length && this[i]!=e; i++);
  return !(i==this.length);
}


还有一个大牛是这样写的:
Array.prototype.S = String.fromCharCode(2);
Array.prototype.in_array = function(e) {
  var r = new RegExp(this.S+e+this.S);
  return (r.test(this.S+this.join(this.S)+this.S));
}

站外扩展:

Jquery实现方式:http://api.jquery.com/jQuery.inArray/

具体选择看个人需求,三水点靠木小编建议能不用正则则不用,效率问题,代码是简洁就怕一些老的浏览器不支持。

Javascript 相关文章推荐
超清晰的document对象详解
Feb 27 Javascript
大家未必知道的Js技巧收藏
Apr 07 Javascript
js的表单操作 简单计算器
Dec 29 Javascript
js控制再次点击按钮之间的间隔时间可防止重复提交
Aug 01 Javascript
JS实现点击按钮控制Div变宽、增高及调整背景色的方法
Aug 05 Javascript
JavaScript toUpperCase()方法使用详解
Aug 26 Javascript
JavaScript中字符串的常用操作方法及特殊字符
Mar 18 Javascript
element-ui 限制日期选择的方法(datepicker)
May 16 Javascript
移动端图片上传旋转、压缩问题的方法
Oct 16 Javascript
了解JavaScript中let语句
May 30 Javascript
Vue+Koa2 打包后进行线上部署的教程详解
Jul 31 Javascript
解决vue使用vant轮播组件swipe + flex时文字抖动问题
Jan 07 Vue.js
JavaScript中消除闭包的一般方法介绍
Mar 16 #Javascript
jQuery实现的支持IE的html滑动条
Mar 16 #Javascript
JavaScript计算两个日期时间段内日期的方法
Mar 16 #Javascript
nw.js实现类似微信的聊天软件
Mar 16 #Javascript
JavaScript控制table某列不显示的方法
Mar 16 #Javascript
详解addEventListener的三个参数之useCapture
Mar 16 #Javascript
解决Jquery向页面append新元素之后事件的绑定问题
Mar 16 #Javascript
You might like
PHP 中dirname(_file_)讲解
2007/03/18 PHP
php设计模式 DAO(数据访问对象模式)
2011/06/26 PHP
PHP根据传来的16进制颜色代码自动改变背景颜色
2014/06/13 PHP
PHP中使用break跳出多重循环代码实例
2015/01/21 PHP
PHP数组操作类实例
2015/07/11 PHP
Yii模型操作之criteria查找数据库的方法
2016/07/15 PHP
CentOS7系统搭建LAMP及更新PHP版本操作详解
2020/03/26 PHP
javascript 哈希表(hashtable)的简单实现
2010/01/20 Javascript
给超链接添加特效鼠标移动展示提示信息且随鼠标移动
2013/10/17 Javascript
Javascript学习笔记之 函数篇(三) : 闭包和引用
2014/11/23 Javascript
解决bootstrap中modal遇到Esc键无法关闭页面
2015/03/09 Javascript
javascript制作2048游戏
2015/03/30 Javascript
jQuery Validation PlugIn的使用方法详解
2015/12/18 Javascript
全面解析Bootstrap中tooltip、popover的使用方法
2016/06/13 Javascript
基于JS如何实现给字符加千分符(65,541,694,158)
2016/08/03 Javascript
vue用addRoutes实现动态路由的示例
2017/09/15 Javascript
JavaScript实现多文件下载方法解析
2020/08/07 Javascript
Vue使用axios引起的后台session不同操作
2020/08/14 Javascript
javascript实现移动端上传图片功能
2020/08/18 Javascript
Python sys.path详细介绍
2013/10/17 Python
跟老齐学Python之眼花缭乱的运算符
2014/09/14 Python
Python爬取网易云音乐上评论火爆的歌曲
2017/01/19 Python
Python之ReportLab绘制条形码和二维码的实例
2018/01/15 Python
Python利用pandas计算多个CSV文件数据值的实例
2018/04/19 Python
浅谈pandas.cut与pandas.qcut的使用方法及区别
2020/03/03 Python
python在CMD界面读取excel所有数据的示例
2020/09/28 Python
定义一结构体变量,用其表示点坐标,并输入两点坐标,求两点之间的距离
2015/08/17 面试题
书香校园建设方案
2014/05/02 职场文书
干部个人对照检查材料
2014/08/25 职场文书
思想品德评语大全
2014/12/31 职场文书
老员工辞职信范文
2015/05/12 职场文书
师德培训心得体会2016
2016/01/09 职场文书
React-vscode使用jsx语法的问题及解决方法
2021/06/21 Javascript
OpenCV实现普通阈值
2021/11/17 Java/Android
教你修复 Win11应用商店加载空白问题
2021/12/06 数码科技
Shell脚本一键安装Nginx服务自定义Nginx版本
2022/03/20 Servers