澳门新葡萄京官网注册巧用 省略 if

传统的写法是这样的:

今天重点讲下 如何给Array对象扩展 1、直接在Array.prototype 上扩展
2、用自己方法对数组对象进行扩展
直接在Array.prototype上扩展,不能直接对dom对象使用(如:document.getElementsByTagName;
对有洁癖的同学而言 也破了原始生态环境的 : ) 先来看下
yui操作数组的一些方法,这里我对源码简单剥离并改动了下 复制代码 代码如下: { var YArray; YArray =
function{ var t = ? 2 : YArray.test, l, a, start = idx || 0; if { try {
return Array.prototype.slice.call;
//借助Array原生方法来把aguments转换为JS数组 } catch { a = []; l =
o.length; for { a.push; } return a; } } else { return [o]; } }
YArray.test = function{ var r = 0; if (o && (typeof o == ‘object’
||typeof o == ‘function’)) { if (Object.prototype.toString.call ===
“[object Array]”) { r = 1; } else { try { if && !o.tagName && !o.alert
&& !o.apply) { r = 2; } } catch {} } } return r; } YArray.each =
(Array.prototype.forEach) ? //先检测浏览器是否已支持,若有则调用原生
function { Array.prototype.forEach.call; return YArray; } : function {
var l = || 0, i; for { f.call; } return YArray; }; YArray.hash =
function { var o = {}, l = k.length, vl = v && v.length, i; for { if {
o[k[i]] = ? v[i] : true; } } return o; }; YArray.indexOf =
(Array.prototype.indexOf) ? function { return
Array.prototype.indexOf.call; } : function { for (var i=0; i复制代码
代码如下: Array.apply; [].slice.call;
[].splice.call(arguments,0,arguments.length); [].concat.apply; …
YArray函数不仅可以操作数组对象也对nodeList对象进行了操作
YArray(document.getElementsByTagName; 遍历dom对象 重新组装成一个数组 : )
复制代码 代码如下: a = []; l =
o.length; for { a.push; } return a; YArray.each
遍历数组,如有传入函数,每次遍历都执行callback 复制代码 代码如下:
YArray.each([1,2,3],function;// 执行了3次,1,2,3 }); YArray.hash 数组
组装成 键值对 可以理解成一个json对象 YArray.hash; YArray.indexOf
返回一样的该值在数组的索引值 YArray.indexOf YArray.numericSort
对数组进行排序,从小到大 [3, 1, 2].sort; YArray.some
是否数组中的有元素通过了callBack的处理?如果有,则立马返回true,如果一个都没有,则返回false
复制代码 代码如下: YArray.some([3, 1,
2],function{ return el < 4; }) 让我们看看 javascript 1.6 -1.8
对数组的扩展 ,并学习如何实现相同的功能 every filter forEach indexOf
lastIndexOf map some reduce reduceRight Array.prototype.every 复制代码 代码如下: if (!Array.prototype.every)
{ Array.prototype.every = function { var len = this.length >>>
0; if (typeof fun != “function”) throw new TypeError(); var thisp =
arguments[1]; for (var i = 0; i < len; i++) { if (i in this &&
!fun.call(thisp, this[i], i, this)) return false; } return true; }; }
是否数组中的每个元素都通过了callBack的处理?如果是,则返回true,如果有一个不是,则立马返回false
这和我们刚才提到的YUI种的 some 函数 很雷同 :) 功能刚好相反
Array.prototype.filter 复制代码 代码如下:
Array.prototype.filter = function { //过滤器 ,添加方便,进行判断过滤
var values = []; var thisp = arguments[1]; for (var i = 0; i <
this.length; i++) if (block.call values.push; return values; }; 使用方法
复制代码 代码如下: var val=
numbers.filter{ return t < 5 ; }) alert; forEach 和 indexOf 和 some
可以参考 上面yui的代码 ,不再重述 lastIndexOf 和 indexOf 代码相似
只是从最后开始遍历 下面讲下 ‘ map’ 复制代码 代码如下: Array.prototype.map =
function { var len = this.length >>> 0; if (typeof fun !=
“function”) throw new TypeError(); var res = new Array; var thisp =
arguments[1]; for (var i = 0; i < len; i++) { if res[i] =
fun.call(thisp, this[i], i, this); } return res; };
遍历数组,执行函数,迭代数组,每个元素作为参数执行callBack方法,由callBack方法对每个元素进行处理,最后返回处理后的一个数组
var numbers = [1, 4, 9]; var roots = numbers.map{return a * 2});
Array.prototype.reduce 复制代码 代码如下:
Array.prototype.reduce = function { var len = this.length >>>
0; if (typeof fun != “function”) throw new TypeError(); if (len == 0 &&
arguments.length == 1) throw new TypeError(); var i = 0; if
(arguments.length >= 2) { var rv = arguments[1]; } else { do { if {
rv = this[i++]; break; } if throw new TypeError; } for { if rv =
fun.call(null, rv, this[i]澳门新葡萄京官网注册,, i, this); } return rv; };
让数组元素依次调用给定函数,最后返回一个值,换言之给定函数一定要用返回值
Array.prototype.reduceRight 见名故而思意,从右往左 复制代码 代码如下: Array.prototype.reduceRight
= function { var len = this.length >>> 0; if (typeof fun !=
“function”) throw new TypeError(); if (len == 0 && arguments.length ==
1) throw new TypeError(); var i = len – 1; if (arguments.length >= 2)
{ var rv = arguments[1]; } else { do { if { rv = this[i–]; break; }
if throw new TypeError; } for { if rv = fun.call(null, rv, this[i], i,
this); } return rv; };
除了这些,只用想用到的方法都能加到Array.prototype上 比如常用的toString
复制代码 代码如下:
Array.prototype.toString = function () { return this.join; }; 还可以添加
toJson ,uniq ,compact,reverse等 Array扩展对开发还是很有帮助滴 : )

这样的形式执行:

var fun = function () { alert(“cftea”); } if (typeof fun == “function”)
{ fun(); }

复制代码 代码如下:

但关于 if 这句,我们还可以更简洁:

d.wait(3000).run(function(m){ //等待3秒
alert(‘从前有座山’);
}).wait(1000).run(function(m){ //等待1秒
alert(‘山里有座庙’);
}).wait(2000).run(function(m){ //等待2秒
alert(‘庙里有一个老和尚给一个小和尚讲故事’);
}).wait(3000).run(function(m){ //等待3秒
alert(‘讲的故事是:’);
}).goStart(); //跳到第一条重新执行,这句拿掉就只执行一次

typeof fun == “function” && fun()

复制代码 代码如下:

由于是 &&,如果前面不为 true,后面 fun() 就不会执行。

<!doctype html>
<html>
<head>
<title>异步执行</title>
</head>
<body>
<script type=”text/javascript”>
function Delay(){
this.funList= [];
this.index = 0;
this.re = null;
this.isloop = false;
};
Delay.prototype = {
wait:function(m){
if(this.funList[this.index] && typeof this.funList[this.index].fun
!= ‘function’){
m += this.funList[this.index].m;
}
this.funList[this.index] = {m:m,fun:null};
return this;
},
run:function(fun){
if(typeof this.funList[this.index].fun != ‘function’){
this.funList[this.index].fun = fun;
this.index++;
}else{
this.index++;
this.funList[this.index] = {‘m’:0,’fun’:fun};
}
this.start();
return this;
},
start:function(){
var self = this;
if(this.re) return;
var setOutrun = function(funList,index){
if(funList[index] == undefined){
clearTimeout(self.re);
return false;
}
var m = funList[index].m,
fun = funList[index].fun;
typeof fun == ‘function’ || (fun = function(){});
self.re = setTimeout(function(){
if(fun(index) === false)return false;
if(self.isloop){
index = -1;
self.isloop = false;
}
setOutrun(funList,++index);
},m);
}
setOutrun(this.funList,0);
},
stop:function(){
return clearTimeout(this.re);
},
goStart:function(){
var self = this,
fun = function(){
self.isloop = true;
};
if(this.funList[this.index] && typeof this.funList[this.index].fun
!= ‘function’){
this.funList[this.index].fun = fun;
this.index++;
}else{
this.funList[this.index] = {‘m’:0,’fun’:fun};
}
this.start();
}
};
var d = new Delay();
d.wait(3000).run(function(m){
alert(‘从前有座山’);
}).wait(2000).run(function(m){
alert(‘山里有座庙’);
}).wait(2000).run(function(m){
alert(‘庙里有一个老和尚给一个小和尚讲故事’);
}).wait(2000).run(function(m){
alert(‘讲的故事是:’);
}).goStart();
</script></body>
</html>

复制代码 代码如下:
d.wait(3000).run(function(m){ //等待3秒 alert(‘从前有座山’);
}).wait(1000).run(function(m){ //等待1秒 alert(‘山里有座…

发表评论

电子邮件地址不会被公开。 必填项已用*标注