编程语言:数据类型/结构,运算,流程控制(分支,循环)
#开发环境
-开发软件:notepad++
-运行环境:浏览器,nodejs(内部都集成了js的解释器)
#编程规范
-注释 // 单行注释 /* */ 多行注释
-关键字
在当前的编程环境中已经被定义好的单词或者词组
比如:public static class void
这些单词不能用作代码命名
-代码命名规范
- 一定要遵守规则
命名必须使用英文大小写,数字,美元符$,下划线_ 构成
并且不能以数字开头
- 业内一起遵守的规则(尽量)
变量名:小驼峰 首字母小写,第二个单词开始首字母大写
helloWorldNiHao
函数名:小驼峰
#书写位置
-写在标签的事件属性中
<div οnclick="js代码"></div>
注意:事件属性中一般不会写很多代码,只会写一行代码(调用函数)
-写在页面的<script></script>
<script>
js代码
</script>
-写在外部的js文件中 .js
通过script标签将js文件引入进来
#js的测试方式
-在控制台打印信息
console.log("信息")
-使用浏览器自带的弹窗
alert("信息")
-直接在页面上输出(前提:页面上没有任何元素)
document.write("信息")
#数据类型(弱类型)
-弱类型:
在定义变量时不需要使用特定的单词进行类型的定义,js统一都使用 var
在使用变量时,变量的值可以随时赋值成任意的类型 var a = 1;a = "hello";a = []
-基本类型
整数 浮点型(小数) 字符串 "" '' 布尔类型 true/false
-引用类型
数组,函数(方法),对象
-特殊类型
null(空指针) NaN(Not A Number) undefined(未定义)
#运算符
-数学运算符 + - * / %取余/模
除法中两个整数相除 10/3=3(商)....1(余数) 10%3=1
-关系判断运算
> < >= <= == != ===全等
== 只比较数值是否相等
=== 先比较数据类型,在比较数值
-逻辑判断运算
并且&& 或者|| 取反!
-赋值运算
a = b 将b的值赋给a
+= -= *= /= %=
-拼接运算
+ 如果加号的左右两边都是数字的类型,那就是数字的加法运算
如果加号的左右两边有一边不是数字的类型,都是拼接运算(最常见的就是字符串和变量的拼接)
-三元运算
A?B:C
作用:分支判断(只支持两个情况)
A:一句条件判断
B:如果A成立,就会执行B的代码
C:如果A不成立,就会执行C的代码
#js的函数
-编程中定义函数
function 函数名(){
函数的内容(代码)
}
-函数的调用
函数名()
-代码的作用域
-数据的有效范围
局部作用域:定义在函数内部的数据,有效范围就在函数内部
全局作用域:定义在函数的外部,有效范围是整个页面
-将局部变量变成全局变量
直接在函数内将变量传给window window.int = int
#取整的方式
直接强转成整数 parseInt(数据)
向上取整 Math.ceil(数据) 3.14 4
向下取整 Math.floor(数据) 3.14 3
四舍五入取整 Math.round(数据) 3.54 4 3.14 3
保留小数的方式 数据.tofixed(位数)
#登录升级3.0
-获取页面元素
-根据id获取页面元素
var e = document.getElementById("idm名字")
var e = document.querySelector("#id名字")
偷懒方式:如果id名符合js的命名规则,那么元素可以直接使用id名来操作
-获取文本框(input)的值
元素.value
-修改文本框(input)的值
元素.value = 新值
#猜数字
-规则:电脑随机生成一个1-100之间的整数
用户输入一个数字,于随机数字进行比对
js判断是 太大,太小,正好
-页面构建
标题 结果的div 输入框(数字),猜一下的按钮,重新开始按钮
-生成随机数
Math.random() 随机一个0~1之间的小数
-修改标签(除了input之外)的内容
元素.innerText = 新的值
-获取标签(除了input之外)的内容
元素.innerText
-设置按钮不可用
元素.disabled = true
-设置文本框不可用
元素_input.disabled = true