详解JS中Array对象扩展与String对象扩展


Posted in Javascript onJanuary 07, 2016

废话不多说了,直接给大家上array对象扩展代码了,具体代码如下所示:

/**
* Created by laixiangran on 2016/01/07.
* Array扩展
*/
(function() {
// 遍历数组
if (typeof Array.prototype.forEach != "function") {
Array.prototype.forEach = function (fn, context) {
for (var i = 0; i < this.length; i++) {
if (typeof fn === "function" && Object.prototype.hasOwnProperty.call(this, i)) {
fn.call(context, this[i], i, this);
}
}
};
}
// 让数组中的每一个元素调用给定的函数,然后把得到的结果放到新数组中返回
if (typeof Array.prototype.map != "function") {
Array.prototype.map = function (fn, context) {
var arr = [];
if (typeof fn === "function") {
for (var k = 0, length = this.length; k < length; k++) {
arr.push(fn.call(context, this[k], k, this));
}
}
return arr;
};
}
// 把符合条件的元素放到一个新数组中返回
if (typeof Array.prototype.filter != "function") {
Array.prototype.filter = function (fn, context) {
var arr = [];
if (typeof fn === "function") {
for (var k = 0, length = this.length; k < length; k++) {
fn.call(context, this[k], k, this) && arr.push(this[k]);
}
}
return arr;
};
}
// 如果数组中的每个元素都能通过给定的函数的测试,则返回true,反之false
if (typeof Array.prototype.every != "function") {
Array.prototype.every = function (fn, context) {
var passed = true;
if (typeof fn === "function") {
for (var k = 0, length = this.length; k < length; k++) {
if (passed === false) break;
passed = !!fn.call(context, this[k], k, this);
}
}
return passed;
};
}
// 类似every函数,但只要有一个通过给定函数的测试就返回true
if (typeof Array.prototype.some != "function") {
Array.prototype.some = function (fn, context) {
var passed = false;
if (typeof fn === "function") {
for (var k = 0, length = this.length; k < length; k++) {
if (passed === true) break;
passed = !!fn.call(context, this[k], k, this);
}
}
return passed;
};
}
// 返回元素在数组的索引,没有则返回-1,从左到右
if (typeof Array.prototype.indexOf != "function") {
Array.prototype.indexOf = function (item, index) {
var n = this.length,
i = index == null ? 0 : index < 0 ? Math.max(0, n + index) : index;
for (; i < n; i++) {
if (i in this && this[i] === item) {
return i
}
}
return -1
};
}
// 返回元素在数组的索引,没有则返回-1,从右到左
if (typeof Array.prototype.lastIndexOf != "function") {
Array.prototype.lastIndexOf = function (item, index) {
var n = this.length,
i = index == null ? n-1 : index < 0 ? Math.max(0, n + index) : index;
for (; i >= 0; i--) {
if (i in this && this[i] === item) {
return i;
}
}
return -1;
};
}
// 让数组元素依次调用给定函数,最后返回一个值(从左到右)
if (typeof Array.prototype.reduce != "function") {
Array.prototype.reduce = function (callback, initialValue) {
var previous = initialValue, k = 0, length = this.length;
if (typeof initialValue === "undefined") {
previous = this[0];
k = 1;
}
if (typeof callback === "function") {
for (k; k < length; k++) {
this.hasOwnProperty(k) && (previous = callback(previous, this[k], k, this));
}
}
return previous;
};
}
// 让数组元素依次调用给定函数,最后返回一个值(从右到左)
if (typeof Array.prototype.reduceRight != "function") {
Array.prototype.reduceRight = function (callback, initialValue) {
var length = this.length, k = length - 1, previous = initialValue;
if (typeof initialValue === "undefined") {
previous = this[length - 1];
k--;
}
if (typeof callback === "function") {
for (k; k > -1; k-=1) {
this.hasOwnProperty(k) && (previous = callback(previous, this[k], k, this));
}
}
return previous;
};
}
// 去掉重复项(唯一性),返回新数组
if (typeof Array.prototype.uniq != "function") {
Array.prototype.uniq = function() {
var arr = [];
arr[0] = this[0];
for (var i = 1; i < this.length; i++) {
if (arr.indexOf(this[i]) == -1) {
arr.push(this[i]);
}
}
return arr;
};
}
// 指定删除数组中某值
if (typeof Array.prototype.remove != "function") {
Array.prototype.remove = function(item) {
for (var i = this.length; i >= 0; i--) {
if (item === this[i]) {
this.splice(i, 1);
}
}
return this;
};
}
// 打乱数组顺序
if (typeof Array.prototype.shuffle != "function") {
Array.prototype.shuffle = function() {
var i = this.length;
while (i) {
var j = Math.floor(Math.random()*i);
var t = this[--i];
this[i] = this[j];
this[j] = t;
}
return this;
};
}
// 求数组的最大值
if (typeof Array.prototype.max != "function") {
Array.prototype.max = function() {
return Math.max.apply({}, this)
};
}
// 求数组的最小值
if (typeof Array.prototype.max != "function") {
Array.prototype.min = function() {
return Math.min.apply({}, this)
};
} 

// 判断是否为数组
if (typeof Array.prototype.isArray != "function") {
Array.prototype.isArray = function() {
return Object.prototype.toString.apply(this) === "[object Array]";
};
} 
}());

下面是string对象扩展代码如下所示:

/**
* Created by laixiangran on 2015/12/12.
* String扩展
*/
(function() {
// 十六进制颜色值的正则表达式
var reg = /^#([0-9a-fA-f]{3}|[0-9a-fA-f]{6})$/;
// RGB颜色转换为16进制
if (typeof String.prototype.rgbToHex != "function") {
String.prototype.rgbToHex = function() {
var that = this;
if (/^(rgb|RGB)/.test(that)) {
var aColor = that.replace(/(?:\(|\)|rgb|RGB)*/g,"").split(",");
var strHex = "#";
for (var i=0; i<aColor.length; i++) {
var hex = Number(aColor[i]).toString(16);
if (hex === "0") {
hex += hex;
}
strHex += hex;
}
if (strHex.length !== 7) {
strHex = that;
}
return strHex;
}else if (reg.test(that)) {
var aNum = that.replace(/#/,"").split("");
if (aNum.length === 6){
return that;
}else if (aNum.length === 3) {
var numHex = "#";
for (var j=0; j<aNum.length; j++) {
numHex += (aNum[j]+aNum[j]);
}
return numHex;
}
}else{
return that;
}
};
}
// 16进制颜色转为RGB格式
if (typeof String.prototype.hexToRgb != "function") {
String.prototype.hexToRgb = function() {
var sColor = this.toLowerCase();
if (sColor && reg.test(sColor)) {
if (sColor.length === 4) {
var sColorNew = "#";
for (var i = 1; i < 4; i++) {
sColorNew += sColor.slice(i,i+1).concat(sColor.slice(i,i+1));
}
sColor = sColorNew;
}
// 处理六位的颜色值
var sColorChange = [];
for (var j=1; j<7; j+=2) {
sColorChange.push(parseInt("0x"+sColor.slice(j,j+2)));
}
return "RGB(" + sColorChange.join(",") + ")";
}else{
return sColor;
}
};
}
// 移除字符串首尾空白
if (typeof String.prototype.trim != "function") {
String.prototype.trim = function() {
return this.replace(/^\s+|\s+$/g, "");
};
}
}());
Javascript 相关文章推荐
JavaScript 设计模式之组合模式解析
Apr 09 Javascript
jquery实现表单验证并阻止非法提交
Jul 09 Javascript
Jquery中巧用Ajax的beforeSend方法
Jan 20 Javascript
谷歌showModalDialog()方法不兼容出现对话窗口的解决办法
Feb 15 Javascript
AngularJS ng-bind 指令简单实现
Jul 30 Javascript
jQuery实现点击任意位置弹出层外关闭弹出层效果
Oct 19 Javascript
前端html中jQuery实现对文本的搜索功能并把搜索相关内容显示出来
Nov 14 jQuery
谈谈vue中mixin的一点理解
Dec 12 Javascript
浅谈vue.js导入css库(elementUi)的方法
Mar 09 Javascript
微信小程序在其他页面监听globalData中值的变化
Jul 15 Javascript
vue中使用elementUI组件手动上传图片功能
Dec 13 Javascript
es6中class类静态方法,静态属性,实例属性,实例方法的理解与应用分析
Feb 15 Javascript
js创建对象的方法汇总
Jan 07 #Javascript
JavaScript截取、切割字符串的技巧
Jan 07 #Javascript
js确认框confirm()用法实例详解
Jan 07 #Javascript
实例讲解jquery与json的结合
Jan 07 #Javascript
javascript仿百度输入框提示自动下拉补全
Jan 07 #Javascript
基于jquery实现表格无刷新分页
Jan 07 #Javascript
js密码强度检测
Jan 07 #Javascript
You might like
php数据结构与算法(PHP描述) 查找与二分法查找
2012/06/21 PHP
在laravel框架中使用model层的方法
2019/10/08 PHP
一个对于Array的简单扩展
2006/10/03 Javascript
让你的网站可编辑的实现js代码
2009/10/19 Javascript
分享一个用Mootools写的鼠标滑过进度条改变进度值的实现代码
2011/12/12 Javascript
『jQuery』名称冲突使用noConflict方法解决
2013/04/22 Javascript
jsp网页搜索结果中实现选中一行使其高亮
2014/02/17 Javascript
JavaScript静态类型检查工具FLOW简介
2015/01/06 Javascript
jQuery动态修改超链接地址的方法
2015/02/13 Javascript
jquery背景跟随鼠标滑动导航
2015/11/20 Javascript
原生JS和jQuery版实现文件上传功能
2016/04/18 Javascript
jQuery EasyUI学习教程之datagrid点击列表头排序
2016/07/09 Javascript
JS正则表达式验证账号、手机号、电话和邮箱是否合法
2017/03/08 Javascript
详解Vue爬坑之vuex初识
2017/06/14 Javascript
react-router4 嵌套路由的使用方法
2017/07/24 Javascript
Vue多系统切换实现方案
2018/06/05 Javascript
微信小程序之swiper滑动面板用法示例
2018/12/04 Javascript
JavaScript 继承 封装 多态实现及原理详解
2019/07/29 Javascript
js实现页面导航层级指示效果
2020/08/25 Javascript
Django与JS交互的示例代码
2017/08/23 Python
Python比较配置文件的方法实例详解
2019/06/06 Python
pyqt5 使用label控件实时显示时间的实例
2019/06/14 Python
处理HTML5新标签的浏览器兼容版问题
2017/03/13 HTML / CSS
红旗团支部事迹材料
2014/01/27 职场文书
劳动之星获奖感言
2014/02/01 职场文书
大学校园活动策划书
2014/02/04 职场文书
财务总经理岗位职责
2014/02/16 职场文书
2014年精神文明工作总结
2014/12/23 职场文书
2015年六一儿童节活动总结
2015/02/11 职场文书
培训通知
2015/04/17 职场文书
农村婚礼司仪主持词
2015/06/29 职场文书
2016暑期社会实践新闻稿
2015/11/25 职场文书
浅谈Python魔法方法
2021/06/28 Java/Android
使用pipenv管理python虚拟环境的全过程
2021/09/25 Python
vue 实现弹窗关闭后刷新效果
2022/04/08 Vue.js
Python Pandas解析读写 CSV 文件
2022/04/11 Python