发表于: 2017-04-18 20:52:44
2 698
今天完成的事情
- 1. 完成任务task-js-01
- 2. 学习js基础知识
明天计划的事情
- 1. 继续刷js基础
- 2. 熟悉数组对象,了解正则表达式是什么
遇到的问题
- 1. 任务一随机取色
Math.floor(Math.random()*0xffffff).toString(16);
Math.random()
产生0-1之间一个随机float数Math.floor()
向上下取整toString(16)
转换为十六进制值的字符串
好,得到了表示#000000-#ffffff之间颜色值的字符串 - 2. 得到的颜色值不重复
a. 先来判断是否和默认颜色值是否相同
do {gridColor[i] = randomColor();}while(gridColor[i] === "f3f909");
b. 然后再来判断得到的颜色是否与之前取得的相同
//遍历for (var n = i - 1; n >= 0; n--) {//排除位置相同盒子if (gridBox[i] === gridBox[n]) {gridBox[i] = getGridId();n = i - 1;}//排除相同颜色if (gridColor[i] === gridColor[n]) {gridColor[i] = randomColor();n = i - 1;}}//这个其实是将颜色和格子重复都检查了,实际上写在两个循环中会省资源,偷懒了。。。
- 设置延时函数,多次点击
<button>
会启动多个函数,导致调用claearInterval()
无效
解决:设置一个表变量用来表示setInterval()
的状态就好了啊,点击<button>
之后先判断这个变量即可。
收获
关于收获:
感觉这个任务做完基本没有用到什么JavaScript的知识呢。
总结一下两天学习到的知识点吧:
###吐槽###官网的文本编辑真实让人操碎了💗!
1# DOM
2# 通过ID获取元素
3# innerHTML属性
4# 改变HTML样式
5# 显示和隐藏
6# 控制类名
setInterval()
setInterval()
函数 指定时间重复执行对应的函数或者代码
该函数属于全局函数window
语法:
setInterval ( code, milliseconds[, args...] )
code
:需要执行的函数或者代码milliseconds
:执行函数或者代码的间隔时间,msargs
:可选,给被调用函数传递参数
function sayHi(msg){alert(msg);}// 每隔5秒钟就弹出提示信息"CodePlayer"。setInterval('sayHi("CodePlayer");', 5000);
返回值:
setTimeout()
函数将返回一个标识符 ID,这个 ID 是唯一的(一般是整数,从1开始,每调用一次 setTimeout() 就加1)。
如果需要 setTimeout() 执行的函数或代码尚未执行,我们可以通过 clearTimeout()
函数来取消该执行操作,clearTimeout()
函数需要接收一个参数,这个参数就是setTimeout()
函数返回的标识符ID。
setTimeout()
setTimeout()
函数 函数用于设定在指定的时间之后执行对应的函数或代码。
该函数属于全局函数window
语法:
setTimeout ( code, milliseconds[, args...] )
code
:需要执行的函数或者代码milliseconds
:执行函数或者代码的间隔时间,msargs
:可选,给被调用函数传递参数
function sayHi(msg){alert(msg);}// 在5秒钟后弹出提示信息"欢迎来到CodePlayer"。setTimeout('sayHi("欢迎来到CodePlayer");', 5000);
返回值:
setTimeout()
函数将返回一个标识符 ID,这个 ID 是唯一的(一般是整数,从1开始,每调用一次 setTimeout() 就加1)。
如果需要setTimeout()
执行的函数或代码尚未执行,我们可以通过 clearTimeout() 函数来取消该执行操作,clearTimeout()
函数需要接收一个参数,这个参数就是setTimeout()
函数返回的标识符ID。
while
while(case) {somecode;}// if case == true, somecode run always
do while
do{somecode;}while(case);// you known what that mean
for
for(statement1; case; statement2){somecode;}
for/in
循环遍历对象的属性
var person={fname:"John",lname:"Doe",age:25};for (x in person) {txt=txt + person[x];}document.getElementById("demo").innerHTML=txt;
输出结果:BillGates56
switch
switch(n) {case 1:somecode;break;case 2:somecode;break;...default:somecode;}
break / continue
label
eg:
var num = 0;outPoint:for (var i = 0 ; i < 10 ; i++){for (var j = 0 ; j < 10 ; j++){if( i == 5 && j == 5 ){break outPoint;}num++;}}alert(num); // 循环在 i 为5,j 为5的时候跳出双循环,返回到outPoint层继续执行,输出 55
var num = 0;outPoint:for(var i = 0; i < 10; i++){for(var j = 0; j < 10; j++){if(i == 5 && j == 5){continue outPoint;}num++;}}alert(num); //95
从alert(num)的值可以看出,continue outPoint;语句的作用是跳出当前循环,并跳转到outPoint(标签)下的for循环继续执行。
<hr />
对今天踩了一个大坑:
intervalId = setInterval(changeColor, 300);
对的,就是这句,原本不是这样的,原本是
intervalId = setInterval(changeColor(), 300);
这就导致我我的setInterval()只执行一次就挂了
所以,有了下面的总结
函数名其实就是指向函数体的指针
不加括号, 可以认为是查看该函数的完整信息,
不加括号传参,相当于传入函数整体
加括号表示立即调用(执行)这个函数里面的代码(花括号部分的代码)
语法 | 描述 |
---|---|
函数名 fun 为参数 | fun函数体对象是参数 |
带括号的函数 fun() 作为参数 | 立即执行函数后的返回值作为参数 |
举例
- 1. alert弹出框的的内容
function demo1(){var m=5;return m;}
- 2. alert弹出框的的内容
5
- 3. 单击按钮(其实啥也没有)
- 4. 单击按钮后弹出框内容
function demo2(){var m=55;alert(m);}
评论