JS有三大特点
1.解释执行，无需编译
2.弱类型语言
3.动态语言
(1)脚本语言。JavaScript是一种解释型的脚本语言,C、C++等语言先编译后执行,而JavaScript是在程序的运行<过程中逐行进行解释。
(2)基于对象。JavaScript是一种基于对象的脚本语言,它不仅可以创建对象,也能使用现有的对象。
(3)简单。JavaScript语言中采用的是弱类型的变量类型,对使用的数据类型未做出严格的要求,是基于Java基本语句和控制的脚本语言,其设计简单紧凑。
(4)动态性。JavaScript是一种采用事件驱动的脚本语言,它不需要经过Web服务器就可以对用户的输入做出响应。在访问一个网页时,鼠标在网页中进行鼠标点击或上下移、窗口移动等操作JavaScript都可直接对这些事件给出相应的响应。
(5)跨平台性。JavaScript脚本语言不依赖于操作系统,仅需要浏览器的支持。因此一个JavaScript脚本在编写后可以带到任意机器上使用,前提上机器上的浏览器支 持JavaScript脚本语言,目前JavaScript已被大多数的浏览器所支持
标识符（指用来标识某个实体的一个符号，是用户编程时使用的名字，用于给变量、常量、函数、语句块等命名，以建立起名称与使用之间的关系）
标识符命名规则
1.只能有英文字母、数字、下划线、美元符号组成；
2.不能以数字开头；
3.不能是关键字与保留字；
4.严格区分大小写
保留字: 系统留用(可能永远也不会用, 但是你不能用)。
关键字: 系统规定有特殊意义的词。
关键字, 一定是保留字。
保留字一般是等同于关键字的。
JS的数据类型
1.number 数值类型
2.string 字符串
3.boolean 布尔类型
4.null 空 object
5.undefined 未定义的
数组、对象、函数 是引用数据类型
var userName;//先声明，后赋值
userName="Tom";
var age=18;//声明的同时赋值
console.log(age);
console.log(typeof(age));//检测数据类型typeof();
console.log(typeof(userName));
内置Math对象的常用方法
Math.ceil();//向上取整
Math.floor();//向下取整
Math.random();//[0,1)随机数
Math.round();//四舍五入
Date（）对象
var now=new Date();
var y=now.getFullYear();//获取年份。getYear()返回1900年到现在的年数
var mo=now.getMonth()+1;//月份0-11
mo=plus0(mo);
var d=now.getDate();//日
d=plus0(d);
var day=now.getDay();//星期 0代表星期日，0-6;
switch(day){
case 0:
day='星期日';
break;
case 1:
day='星期一';
break;
case 2:
day='星期二';
break;
case 3:
day='星期三';
break;
case 4:
day='星期四';
break;
case 5:
day='星期五';
break;
case 6:
day='星期六';
break;
default:
break;
}
function plus0(num){
if(num<10){
return num='0'+num;
}else{
return num;
}
}
var h=now.getHours();
h=plus0(h);
var m=now.getMinutes();
m=plus0(m);
var s=now.getSeconds();
s=plus0(s);
document.write(`${y}/${mo}/${d} ${day} ${h}:${m}:${s}`);
String对象 字符串
charAt() 返回指定索引位置的字符
indexOf() 返回字符串中检索指定字符第一次出现的位置
replace() 替换与正则表达式匹配的子串
slice() 提取字符串的片断，并在新的字符串中返回被提取的部分
JS数组
var arr=[1,“abc”,true]; //推荐
var arr2=new Array(1,“abc”,true); //当()里只有一个参数代表数组大小
抽奖小练习
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>gift</title>
<style>
#big{
float: left;
350px;
margin: 0 34%;
}
.ddd{
100px;
height: 100px;
margin: 20px;
border: 10px solid pink;
float:left;
text-align: center;
font-size: 20px;
font-weight: bold;
}
#bottom{
margin-top: 100px;
}
</style>
</head>
<body>
<div id="big" align="center">
<div id="person" class="ddd"></div>
<div id="gift" class="ddd"></div>
<div id="bottom"><input type="button" value="开始" onclick="start()"/>
<input type="button" value="停止" style="margin-left: 50px;"/ onclick="stop()"></div>
</div>
<script>
var person=["小乔","大乔","妲己","安琪拉","王昭君"];
var gift=["口红","面膜","bb霜","防晒霜","钻戒"];
var divp=document.getElementById("person");
var divg=document.getElementById("gift");
var timer;
function change(){
var rand1=Math.floor(Math.random()*5);
var rand2=Math.floor(Math.random()*5);
divp.innerHTML=person[rand1];
divg.innerHTML=gift[rand2];
}
function start(){
stop();
timer=setInterval(change,50);
}
function stop(){
clearInterval(timer);
}
</script>
</body>
</html>