1.输入输出语句
a.输出语句
用于在浏览器中弹出警告
alert("未满十八岁禁止访问");
用于在控制台中输入信息
console.log('111');
用于在网页中输出内容
document.write("三月请对我好一点")
b.输入语句
在网页中弹出一个输入框
prompt("请输入姓名")
在网页中弹出一个确认框
输入语句
//在网页中弹出一个输入框
//prompt("请输入姓名")
//在网页中弹出一个确认框
//confirm("你真的满十八了吗?")
2.JS代码的引入方式
<!-- js行内写法 -->
<!-- onclick点击事件 -->
<button οnclick="window.alert('别点了,再点人就傻了')">请点我</button>
<!-- 嵌入式 -->
<script>window.alert("内部样式")</script>
<!-- 外链式 -->
<script src="./3-外链式.js"></script>
3.变量
1. 变量的声明与赋值
声明变量
var boy;
var girl;
console.log(boy);//undefined(未定义的)
console.log(girl);
为变量赋值
boy="jack";
girl="lily";
console.log(boy);//jack
console.log(girl);//lily
2.let声明变量
let是ES6新引入的关键字,用来代替var的关键字;
ES6是指2015年推出的ECMAScript(语法)
<script>
var boyfriend="魏大勋";
var boyfriend="魏晨";
var boyfriend="白敬亭";
console.log(boyfriend);
//let不允许在一个代码块里有变量和他取同一个名字,但是允许修改同一个变量值
let girlfriend="蔡徐坤";
girlfriend="马嘉祺";
console.log(girlfriend);
{let girlfriend="xxx"}
</script>
3.const声明变量
错误写法
const a=3.14
a=3.15
console.log(a)
正确写法
const a=3.14
console.log(a);
const b;
const必须要在声明的时候就赋值
4.关于变量
a.变量的声明与赋值
//[先声明后赋值]
//声明变量
var boy;
var girl;
console.log(boy);//undeginded(未定义的)
console.log(girl);
//为变量赋值
boy="jack";
girl="lily"
console.log(boy);//jack
console.log(girl);//lily
//[声明的同时并赋值]
var myage =18;
var myheight=188;
console.log(myage);
console.log(myheight);
b.let声明变量
let是ES6新引入的关键字,用来代替var关键字
(ES6指2015年推出的ECMAScript语法)
<script>
var boyfriend="魏大勋";
var boyfriend="魏晨";
var boyfriend="白敬亭";
console.log(boyfriend);
//let不允许在一个代码块里有变量和他取同一个名字,但是允许修改同一个变量值
let girlfriend="蔡徐坤";
girlfriend="马嘉祺";
console.log(girlfriend);
{let girlfriend="xxx"}
</script>
c.const声明变量
Tips: let和var声明的变量可以改变
const声明的变量不可以改变,即常量
const必须要在声明的时候就赋值
//错误写法
// const a=3;
// a=5;
// console.log(a);
//正确写法
const a=4
console.log(a);
d.let,var,const声明变量的区别
(1)初始化要求不同
使用var和let声明变量时可以先不初始化,而使用const声明变量时必须初始化。
(2)重复声明不同
使用var和let声明的变量可以多次被修改,其值只与最近一次赋值一致,而使用const声明的变量,在整个运行过程中不能修改初值
(3)对块级作用域的支持不同。
(使用一对花括号括起来的代码称为一个代码块所谓块级作用域,就是指变量起作用的范围是当前代码块,离开当前代码块,变量就失效了。
使用var声明的变量支持全局作用域,使用let和const声明的变量支持块级作用域。
5.关于数据类型
a.数据类型的分类
简单数据类型存储在栈内存中
复杂数据类型的内存存储在堆内存中,地址存储在栈内存中
b.基本数据类型
//boolean-布尔型
let flag1=true;
let flag2=false;
//True,Flase,TRUE,FALSE这些写法都是错的
console.log(flag1);
let flag3="true"
console.log(flag3);
//number-数字型
let age=18;
let date="0306";
console.log(age);
console.log(date);
console.log(Number.MAX_VALUE);//最大值
console.log(Number.MAX_VALUE*2);//infinity无穷大
var a=3-"b";
console.log(a);//NaN(Not a Number) NaN也属于数字类型(非数字)
console.log(isNaN(a));//ture
console.log(isNaN(111));//false
console.log(isNaN("abc"));//ture
console.log(isNaN(Infinity));//false
console.log(isNaN("false"));//ture
//string-字符串
let demo1="字符串";
let demo2='字符串';
let demo3=`字符串`;
let demo4="老师说'今天不上晚自习'"
console.log("111\'222");
//undefinded-未定义型
//表示声明的变量还未赋值
let grate;
console.log(grate);//undefinded
//null-空型
var a=null;
console.log(a);//null
c.数据类型检测
isNaN 检验是否是一个非数字
格式:typeof()
Tips:布尔类型ture,会在运算中转化为数字1
布尔类型false。会在运算中转化为数字0
加号遇上字符串,做拼接使用
console.log(typeof("123"));//string
console.log(typeof(false));//boolean
console.log(typeof(NaN));//Number
console.log(typeof(Infinity));//Number
console.log(typeof("true"));//string
console.log(typeof(null));//object
console.log(typeof(undefined));//undefined
console.log(typeof('aaa'*2));//Number
console.log("aaa"*2);//NaN
console.log(2-"true");//NaN
console.log(typeof(2-"true"));//Number
console.log(2-true);//1
console.log(typeof(2-true));//Number
console.log(2+"true");//2true
console.log(typeof(2+"true"));//string
console.log(2+true);//3
console.log(typeof(2+true));//Number
d.数据类型的转化
1. 格式: Boolean()
Tips:将数据类型转换为布尔类型
字符串类型和数字类型都会转化为布尔类型的true
空字符串转为布尔类型的false,空字符串转为ture
数字0转为布尔类型的false
2. 将数据转化为字符串类型
Tips:使用String()或toString进行转换
3. 将数据转化为数字型
Tips:Number()用于将数据转化为数字型数据
//Boolean()
var a=Boolean("a");
console.log(a);//true
console.log(Boolean(123));//true
console.log(Boolean(""));//false
console.log(Boolean(" "));//true
console.log(Boolean(0));//false
console.log(Boolean(NaN));//false
console.log(Boolean(undefined));//false
console.log(Boolean(null));//false
//将数据转化为字符串类型
//使用String()或toString进行转换
let num=123;
console.log(num);//数字类型的1
let num2=String(num);
console.log(num2);//字符串类型的1
//将数据转化为数字型
//Number()用于将数据转化为数字型数据
console.log(Number(123));//123
console.log(Number("123"));//数字类型123
console.log(Number(""));//0
console.log(Number(" "));//0
console.log(Number(null));//0
console.log(Number(undefined));//NaN
console.log(Number(false));//0
console.log(Number(true));//1
console.log(Number("true"));//NaN
console.log(Number("123.1"));//123.1
console.log(Number("123.a"));//123.a
6.流程控制
一.选择结构
a.if语句(单分支)
格式:if(条件表达式){代码段}
<script>
let age=prompt("输入年龄")
if (age>=18) {
document.write("欢迎进入")
}
</script>
b.if...else语句(双分支)
格式:if(条件表达式){代码段} else {代码段2}
<script>
let age=prompt("输入年龄")
if (age>=18) {
document.write("欢迎进入")
}else{
document.write("不可进入")
}
</script>
c.if..else if..else语句(多分支)
格式:if (条件表达式1) {
结果1
}else if (条件表达式2) {
结果2
}else if (条件表达式3) {
结果3
}else{
除去123之后的结果
}
<script>
let num=prompt("输入分数(0~100)不可乱写")
if (num===100) {
document.write("奖学金")
}else if (num>=80&&num<=99) {
document.write("成绩优秀")
}else if (num>=60&&num<=80) {
document.write("成绩合格")
}else if (num>=40&&num<=60) {
document.write("有补考机会")
}else if (num>=20&&num<=40) {
document.write("挂科")
}else(
document.write("留级")
)
</script>
d.switch语句
case--情况; break--跳出语句
switch (表达式) {
case 值1:
代码段
break;
case 值2:
代码段
break;
case 值3:
代码段
break;
...
default:
代码段n
}