2017.11.24——学习笔记（一）【数字雨及数组分…

2018-06-24 00:53:43来源：未知阅读 ()

【以下作品非原创，仅学习用】

var cav = document.getElementById('cav');
var ctx = cav.getContext('2d');
var W = window.innerWidth;
var H = window.innerHeight;
console.log(window.innerHeight);
console.log(document.body.clientWidth);
cav.width = W;
cav.height = H;
var fontsize = 16;
var columns = Math.ceil(W/fontsize);
var drops = [];
var texts = "0123456789".split("");//生成一个字符串数组texts = ["0","1","2","3","4",......]
for(var i=0;i<columns;i++){
　　drops[i]=0;
　　//drops[i]是数字雨坠落的总列数
　　//直接给drops数组创建了columns个对象不过各个对象都是零.
　　console.log(drops[i]);
}

//1.设置画布基础设置
//2.读取窗口宽高
//3.让画布宽高等于窗口宽高
//4.定义变量fontsize = 16;用途有2,1是用窗口宽度/fontsize来数字雨的列数.
//5.定义数组drops,这是数字雨的列.
//6.创建字符串数组texts,包含需要在画布中绘画出来的数字
//7.依照column的数值遍历出数字雨的列数,塞进drops数组里,让列数们的初始值等于0;

//8.绘出底色,因为是用定时器不停地绘制出来,所以透明度调低,营造出跳出来的数字渐渐消失的景象(事实上是被每30毫秒绘出来的底色不停地覆盖)
//8.5遍历出drops[i]--这个数组里,的每一个元素,都指索引所对应的那个列里,目前包含的数字的数目.
//9.用fontsize设置字体大小,设置字体.
//10.事实上每30毫秒每一列同时出现一个数字,所以又以列数遍历生成每列一个随机数字--text =[Math.floor(Math.random()*texts.length)];
//random的区间在0~1,texts.length=10,然后四舍五入变为整数,也就是会生成0~9的数字
//11.然后随机找个坐标为(x = i*fontsize,y = drops[i]*fontsize)的位置画出来.
//12.判定:1.如果drops[i].fontsize即将超出现有窗口的高度H,让这个列的数目为0,它将从0*fontsize的位置重新绘制数字(也就是从头开始嘛); 2.如果随机数即将大于0.95(也就是会算出text=10),让它如上述一样从头开始.

array.slice( start,end )--数组
　　该方法是对数组进行部分截取,并返回一个数组副本
　　start : 截取的开始数组索引
　　end : 你要取得最后一个数组元素的索引加上1
　　截到的数组的索引为: end-1
　　*原数组不改变*
<script>
　　var a = [1,2,3,4,5,6];
　　var b = a.slice(3);//如果不传入end,则会从start截到数组尾部
　　var c = a.slice(2,4);//截到a[2]-a[3],
　　console.log(c);

　　var d = a.slice(-1);//输出b = [a[5]];如果两个参数任何一个是负数,array.length会和它们相加,试图让他们成为非负数.
　　//当只传入一个负数时,length会与参数相加,然后由此作为索引截取
　　console.log(d)

　　var e = a.slice(-6);
　　//当只传入一个参数,是负数时,并且参数绝大值大于数组length,会截取整个数组.因为参数+length会小于0嘛,索引小于0,就按0开始截罗
　　console.log(e)

　　var f = a.slice(-4,-1);
　　//当传入两个其中有负的参数时,length也会先与负数相加后,再截取
　　//一切都按照与length相加后剩余的数做索引为准,end若为负相加之后还是要-1

　　console.log(f)

　　var g = b.slice(6);//当传入一个参数,大于等于length时,返回一个空数组
　　console.log(g)
</script>

string.slice( start,end )--字符串
　　slice方法复制string的一部分来构造一个新的字符串,用法与参数均和数组的slice方法一样,end参数等于你要取的最后一个字符的位置值加上1
　　字符串中空格也占一个索引

array.splice( start, deleteCount, item )
　　splice从array中移除一个或多个数组,并用新的item替换它们,参数start是从数组array中移除元素的开始位置,参数deleteCount是要移除的元素的个数,如果有额外的参数,那么item会插入到被移出元素的位置上,它返回一个包含被移除元素的数组。

　　原数组中不再包含被移除掉的元素

　　d = 在c数组里移除的c[2],c[3], 后面的item参数不会包在d数组里,二是被插进了c数组里原本c[2]的位置,item作用于被移除元素的原数组。
<script>
{
　　var a = ['a','b','c',1,2,3];
　　var b = a.splice(2,2);
　　console.log(a)
　　console.log(b)
　　var c = ['a','b','c',1,2,3,{f:9}];
　　var d = c.splice(2,2,function(){ var i=baby });
　　console.log(c);
　　console.log(d);

//d = 在c数组里移除的c[2],c[3], 后面的item参数不会包在d数组里,二是被插进了c数组里原本c[2]的位置,item作用于被移除元素的原数组
}
</script>

string.split( separator,limit )----字符串
　　split可以把这个string分割成片段来创建一个字符串数组.可选参数limit可以限制被分割的片段数量.separator可以是一个字符串或一个正则表达式.如果separator是一个空字符,会返回一个单字符的数组。
　　split依照separator ,来寻找原字符串中的是否包含separator,以separator作为分隔符来分割字符串变为数组元素,字符串中作为separator的字符会消失。　　
　　一旦使用了split,返回的对象会自动变为一个数组。
　　假如在原字符串中搜索不到separator,就会返回包含一整个字符串做一个元素的数组。

　　当separator是一个空格时：" ",就会把一个句子分成一个个单词。