小编给大家分享一下开发用到的js封装方法有哪些,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!
1、判断是否是一个数组
function isArray(arr){ return Object.prototype.toString.call(arr) ==='[object Array]'; } isArray([1,2,3]) //true
2、判断是否是一个函数(三种)
function isFunction(fn) { return Object.prototype.toString.call(fn) ==='[object Function]'; return fn.constructor == Function; return fn instanceof Function; return typeof (fn) == Function; }
3、数组去重,只考虑数组中元素为数字或者字符串
function newarr(arr){ var arrs = []; for(var i =0;i<arr.length;i++){ if(arrs.indexOf(arr[i])== -1){ arrs.push(arr[i]) } } return arrs; }
4、动态去重
var arr = [1,2, 3, 4]; function add() { var newarr = []; $('.addEle').click(() => { var rnd = Math.ceil(Math.random() * 10); newarr.push(rnd) for (var i =0; i < newarr.length; i++) { if (arr.indexOf(newarr[i]) == -1) { arr.push(newarr[i]) arr.sort(function (a, b) { return b - a //降序 }); } } console.log(arr)//[1,2,3,4,5,6,7,8,9] }) } add()
5、去除字符串空格(包含三种情况)
function trim(str) { return str.replace(/^[" "||" "]*/,"").replace(/[" "|" "]*$/,"");// 去除头和尾 return str.replace(/\s/g,'');//去除所有空格 return str.replace(/(\s*$)/g,"");//去除右边所有空格 }
6、判断是否为邮箱地址
function isEmail(emailStr) { var reg = /^[a-zA-Z0-9]+([._-]*[a-zA-Z0-9]*)*@[a-zA-Z0-9]+.[a-zA-Z0-9{2,5}$]/; var result = reg.test(emailStr); if (result) { alert("ok"); } else { alert("error"); } }
7、判断是否是手机号
function isMobilePhone(phone) { var reg = /^1\d{10}$/; if (reg.test(phone)) { alert('ok'); } else { alert('error'); } }
8、获取一个对象里面第一次元素的数量
function getObjectLength(obj){ var i=0; for( var attrin obj){ if(obj.hasOwnProperty(attr)){ i++; } } console.log(i); } var obj = {name:'kob',age:20}; getObjectLength(obj) //2
9、获取元素相对于浏览器窗口的位置,返回一个{x,y}对象
function getPosition(element) { var offsety = 0; offsety += element.offsetTop; var offsetx = 0; offsetx += element.offsetLeft; if (element.offsetParent != null) { getPosition(element.offsetParent); } return { Left: offsetx, Top: offsety }; }
10、判断某个字母在字符串中出现的次数
var str = 'To be, or not to be, that is the question.'; var count = 0; var pos = str.indexOf('e'); while (pos !== -1) { count++; pos = str.indexOf('e', pos + 1); } console.log(count) //4
11、计算出数组中出现次数最多的元素
var arrayObj = [1,1, 2, 3, 3, 3,4, 5, 5]; var tepm = '',count =0; var newarr = new Array(); for(var i=0;i<arrayObj.length;i++){ if (arrayObj[i] != -1) { temp = arrayObj[i]; } for(var j=0;j<arrayObj.length;j++){ if (temp == arrayObj[j]) { count++; arrayObj[j] = -1; } } newarr.push(temp + ":" + count); count = 0; } for(var i=0;i<newarr.length;i++){ console.log(newarr[i]); }
12、数组filter(搜索功能)
var fruits = ['apple','banana', 'grapes','mango', 'orange']; function filterItems(query) { return fruits.filter(function(el) { return el.toLowerCase().indexOf(query.toLowerCase()) > -1; }) } console.log(filterItems('ap')); // ['apple', 'grapes']
13、copy 对象(第一种)
//第一种 var cloneObj =function(obj) { var newObj = {}; if (obj instanceof Array) { newObj = []; } for (var keyin obj) { var val = obj[key]; newObj[key] = typeof val === 'object' ? cloneObj(val) : val; } return newObj; }; //第二种 function clone(origin , target){ var target = target || {}; for(var propin origin){ target[prop] = origin[prop]; } return target; }
14、深度克隆
var newObj ={}; function deepClone(origin,target){ var target = target || {}, toStr = Object.prototype.toString, arrStr = "[object Array]"; for(var propin origin){ if(origin.hasOwnProperty(prop)){ if(origin[prop] != "null" && typeof(origin[prop]) == 'object'){//判断原型链 target[prop] = (toStr.call(origin[prop]) == arrStr) ? [] : {}//判断obj的key是否是数组 deepClone(origin[prop],target[prop]);//递归的方式 }else{ target[prop] = origin[prop]; } } } return target } deepClone(obj,newObj); console.log(newObj)
15、求数组最大值和最小值
Array.prototype.max = function(){ return Math.max.apply({},this) } Array.prototype.min = function(){ return Math.min.apply({},this) } console.log([1,5,2].max())
16、json数组去重
function UniquePay(paylist){ var payArr = [paylist[0]]; for(var i =1; i < paylist.length; i++){ var payItem = paylist[i]; var repeat = false; for (var j =0; j < payArr.length; j++) { if (payItem.name == payArr[j].name) { repeat = true; break; } } if (!repeat) { payArr.push(payItem); } } return payArr; }
17、对比两个数组,取出交集
Array.intersect = function () { var result = new Array(); var obj = {}; for (var i =0; i < arguments.length; i++) { for (var j =0; j < arguments[i].length; j++) { var str = arguments[i][j]; if (!obj[str]) { obj[str] = 1; } else { obj[str]++; if (obj[str] == arguments.length) { result.push(str); } }//end else }//end for j }//end for i return result; } console.log(Array.intersect(["1","2", "3"], ["2","3", "4", "5", "6"]))
18、数组和对象比较。取出对象的key和数组元素相同的
var arr = ['F00006','F00007','F00008']; var obj = {'F00006':[{'id':21}],'F00007':[{'id':11}]} var newobj = {}; for(var itemin obj){ if(arr.includes(item)){ newobj[item] = obj[item] } } console.log(newObj)
19、删除数组中某个元素
//第一种 Array.prototype.remove = function(val){ var index = this.indexOf(val); if(index !=0){ this.splice(index,1) } } [1,3,4].remove(3) //第二种 function remove(arr, indx) { for (var i =0; i < arr.length; i++) { var index = arr.indexOf(arr[i]); if (indx == index) { arr.splice(index, 1) } } return arr }
20、判断数组是否包含某个元素
Array.prototype.contains = function (val) { for (var i =0; i < this.length; i++) { if (this[i] == val) { return true; } } return false; }; [1, 2,3, 4].contains(2)//true
以上是“开发用到的js封装方法有哪些”这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注亿速云行业资讯频道!
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。