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 相关文章推荐
jQuery 事件队列调整方法
Sep 18 Javascript
js创建元素(节点)示例
Jan 02 Javascript
点击button获取text内容并改变样式的js实现
Sep 09 Javascript
javascript获取flash版本号的方法
Nov 20 Javascript
微信小程序 开发指南详解
Sep 27 Javascript
详解Angularjs 如何自定义Img的ng-load 事件
Feb 15 Javascript
js的函数的按值传递参数(实例讲解)
Nov 16 Javascript
JS与jQuery判断文本框还剩多少字符可以输入的方法
Sep 01 jQuery
jQuery事件blur()方法的使用实例讲解
Mar 30 jQuery
jQuery模仿ToDoList实现简单的待办事项列表
Dec 30 jQuery
JavaScript ECMA-262-3 深入解析(二):变量对象实例详解
Apr 25 Javascript
vue a标签点击实现赋值方式
Sep 07 Javascript
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
关于Laravel Route重定向的一个注意点
2017/01/16 PHP
PHP中include()与require()的区别说明
2017/02/14 PHP
PHP抽象类与接口的区别详解
2019/03/21 PHP
JavaScript 创建对象和构造类实现代码
2009/07/30 Javascript
Flexigrid在IE下不显示数据的处理的解决方法
2013/10/24 Javascript
javascript中Function类型详解
2015/04/28 Javascript
jQuery 1.9.1源码分析系列(十五)动画处理之缓动动画核心Tween
2015/12/03 Javascript
Perl Substr()函数及函数的应用
2015/12/16 Javascript
D3.js实现雷达图的方法详解
2016/09/22 Javascript
浅析jsopn跨域请求原理及cors(跨域资源共享)的完美解决方法
2017/02/06 Javascript
jQuery实现手机号正则验证输入及自动填充空格功能
2018/01/02 jQuery
Vuejs 实现简易 todoList 功能 与 组件实例代码
2018/09/10 Javascript
vue axios 简单封装以及思考
2018/10/09 Javascript
Fundebug支持监控微信小程序HTTP请求错误的方法
2019/02/21 Javascript
利用Vconsole和Fillder进行移动端抓包调试方法
2019/03/05 Javascript
vue 中 elment-ui table合并上下两行相同数据单元格
2019/12/26 Javascript
[05:37]DOTA2-DPC中国联赛 正赛 Elephant vs iG 选手采访
2021/03/11 DOTA
Python中操作MySQL入门实例
2015/02/08 Python
Python 文本文件内容批量抽取实例
2018/12/10 Python
python脚本后台执行方式
2019/12/21 Python
使用TFRecord存取多个数据案例
2020/02/17 Python
python Django 反向访问器的外键冲突解决
2020/05/20 Python
scrapy结合selenium解析动态页面的实现
2020/09/28 Python
HTML5轻松实现全屏视频背景的示例
2018/04/23 HTML / CSS
阿迪达斯法国官方网站:adidas法国
2018/03/20 全球购物
伦敦最受欢迎的蛋糕店:Konditor & Cook
2019/11/01 全球购物
新西兰购物网站:TheMarket NZ
2020/09/19 全球购物
自荐信如何“自荐”
2013/10/24 职场文书
交通事故检查书范文
2014/01/30 职场文书
水利公司纪检监察自我鉴定
2014/02/25 职场文书
写自荐信的注意事项
2014/03/09 职场文书
2014年导购员工作总结
2014/11/18 职场文书
档案工作个人总结
2015/03/03 职场文书
2015年学校总务工作总结
2015/07/20 职场文书
2016年大学迎新晚会工作总结
2015/10/15 职场文书
python munch库的使用解析
2021/05/25 Python