一.直接量和变量
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript">
1.直接量:字面量
数值 :1,2,3,4,5,1.1,1.11,1.356,-1,-2,-3
字符串:由单双引号包裹起来的内容 'hello world' "hello world"
其他:布尔 true/false null
直接量
alert(111);
alert(1.19);
alert(-5);
alert('hello world');
alert('3.14');字符串
alert(3.14);数值
alert(true);
alert(false);
</script>
</head>
<body>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>变量</title>
<script type="text/javascript">
1.变量:变化的量
2.定义变量:变量需要先定义在使用
var 变量名;
变量名的命名规则:
1)变量名必须以字母、下划线、$开头
2)变量名可以包含数字、字母、下划线、$
3)变量名区分大小写
4)不能使用关键字和保留字
3.变量的赋值(变量的初始化):
变量名=值;
4.读取变量中的数据(变量的取值)
变量名
5.若变量只定义,未赋值 undefined
6.定义变量的本质:在内存中开辟空间并且命名(变量名),将数据存入此空间(变量名所代表的空间)
7.变量的赋值是一种值的传递(变量是独立的空间)
变量的定义
var a;定义一个变量,并且命名为a
a=10;赋值 变量的初始化
变量的取值
console.log(a);在控制台中输出日志
1.先定义一个变量,再初始化
var a;定义一个变量
变量初始化
a=20;
取出变量的值
console.log(a);
2.var a=10,b=30,c=10;定义变量的同时即初始化
console.log(a);
console.log(b);
console.log(c);
3.多变量定义
var a,b,c;
a=10;
b=20;
c=30;
变量不可以重复定义
var a=20;在内存中开辟空间命名为a,并且将20存入a这块空间中
var a=30;
console.log(a);
</script>
</head>
<body>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript">
JS是一门弱类型语言,在变量定义的时候,不需要指定数据类型
var a='hello world';
var b=123;
console.log(a);
console.log(b);
var a=20;
console.log(a);
a=30;变量的重复赋值(覆盖)
console.log(a);
a='hello world';
console.log(a);
var a=10;
var b=a;变量的赋值仅仅是一种值的传递
console.log(a);
console.log(b);
a=30;
b=20;
console.log(a);30
console.log(b);10 20
</script>
</head>
<body>
</body>
</html>
二.数据类型
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript">
数据类型:
(1)基本数据类型(原始数据类型)
数值类型(number) 数字 1,2,3,10,1.1,2.1,1.222,-10
字符串类型(string) 由"" '' 字符串内容会原样输出
布尔类型(boolean) false(假) true(真)
undefined 变量定义但未初始化
null 空 引用类型
(2)引用类型
Object Array(数组) Date(日期) Function (函数) RegExp(正则)
检测变量数据类型
typeof 变量名;
注意:typeof表达式本身的结果是一个字符串类型
"string" "number" "boolean" "undefined" "null"
var a=10;
console.log(a);
console.log(typeof a);number
var a='hello';
a='10';
a='3.14';
a="10+20";
console.log(a);
console.log(typeof a);string
var isBoy=false;
console.log(isBoy,typeof isBoy);
var a=10;
console.log(typeof a);
var b=typeof a;将a的数据类型保存在变量b中
console.log(b);"number"
console.log(typeof b);先运算在输出
console.log(typeof typeof a);string
变量的数据类型取决变量里保存的数据
var a=10;number
var b=20;
console.log(typeof a,typeof b);
a=true;boolean
console.log(typeof a);
a='hello';string
console.log(typeof a);
</script>
</head>
<body>
</body>
</html>
三.运算符
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript">
运算符:
运算符根据操作数的个数可以分为:一元(一目)运算符、二元运算符、三元运算符
根据运算符的作用:
(1)算术运算符:
+ - * / %(取余)
一元运算符:
自增:++
自减:--
注意:未赋值时,前置和后置 无区别
赋值时:
1.后置:先赋值,后运算
2.前置:先运算,后赋值
注意:+ 两边有一个为字符串类型时,则执行拼接操作,结果为字符串类型
(2)赋值运算符
= (赋值) += -= *= /= %= 先运算,再赋值
(3)比较运算符
运算结果为boolean类型
>= <= > < ==(等于) !=(不等于) ===(全等)
注意:
== 只比较数值
=== 不仅比较数值,还比较数据类型
(4)逻辑运算符
一般情况下,运算结果为布尔类型
&&(逻辑与) : 并且
若运算符两边均为真(true),则结果为真(true),其它均为假
||(逻辑或) : 或者
运算符两边有一个为真,则为真;两边均为假,则为假
!(逻辑非) : 取反 一元
(5)条件运算符 三元运算符
?:
var a=10;
var b=20;
console.log(a+b);先运算、再输出
十进制、二进制、八进制、十六进制
JavaScript小数运算有问题:精度损失
console.log(0.2*0.2);0.04000000000000001
var a=0.2*0.2;
var b=a.toFixed(2);保留小数点后两位数
console.log(b);
科学计数法
var a1=0.000005;
var a11=5e-6;
var a2=300000000;
var a3=3e8;
console.log(a1);
console.log(a11);
console.log(a2);
console.log(a3);
</script>
</head>
<body>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript">
先赋值,后运算
var a=10;
var b=a++;
var b=a--;
console.log(a);
console.log(b);
1. var a=5;
var b=3;
var c=a+b+(a++);5+3+5
console.log(a,b,c);
2. var a1=a++;
var c=(a++)+(a+b)+(b--);5+9+3
console.log(a,b,c);
3. var a=2;
var b=4;
var a1=a++;2
var b1=b--;4
var b2=b++;3
var c=(a++)+(b--)+(a+b)+(b++);2+4+6+3
console.log(a,b,c);a=3 b=4 c=15
先运算,后赋值
var a=5;
var c=++a;
var b=--a;
console.log(c);6
console.log(b);5
1. var a=3;
var b=5;
var c=(++a)+a+b;4+4+5
console.log(a,b,c);
2. var a=3;
a+=2; a=a+2
a-=2; a=a-2
a*=2;
console.log(a+=2);5
console.log(a*=2);10
console.log(a/=2);5
console.log(a%2);1
console.log(a);
</script>
</head>
<body>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript">
var a=3;
var b=5;
同时成立则为true,有一项不成立则为false
1. var c=a>b&&a<b;false
var c1=a<b&&a<=b;true
var c2=a<b&&a>b;false
var c3=a>b&&a>=b;false
其中满足一项则为true
2. var c=a>b||a<b;true
var c1=a<b||a<=b;true
var c2=a<b||a>b;true
var c3=a>b||a>=b;false
console.log(c,c1,c3);
式子c成立取第一项反之取第二项。
3. var a=10;
var b=5;
var c=a>b?100:50;
console.log(c);
</script>
</head>
<body>
</body>
</html>
四.运算符扩展
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script type="text/javascript">
1.算术运算符
数值类型
var a=10;
var b=5;
console.log(a+b);
字符串
var a='hello';
var b=' 哈哈';
console.log(a+b);字符串拼接
布尔类型
var a=true;
var b=false;
不同类型之间进行算术运算
var a=10;
var b='hello';
var c='5';
var d=true;
var d1=false;
console.log(a+b);拼接操作
console.log(a+c);拼接
数字型字符串与数值按照数值进行运算
console.log(a-c);按照数值运算
console.log(a*c);
console.log(a/c);
布尔类型在参与数学运算时,true 1 false 0
console.log(a+d);11
console.log(a+d1);10
console.log(b+d);拼接操作
console.log(c+d);拼接
console.log(c-d);
2.比较运算符扩展
数值类型
console.log(3>5);
console.log(3==5);
字符串类型
console.log('19'>'5');false 比较首位
console.log(3==3);
console.log('hello '=='hello');
var a=5;
var a1='hello';
var b='10';
var c='5';
console.log(a>b);按照数值比较
console.log(a==c);数值
console.log(a===c);数值和类型
3.逻辑运算符
若逻辑运算符两边有操作数不为布尔类型,则运算结果不一定为布尔类型
布尔类型扩展:0,'',undefined ,null均为假,其他都为真
逻辑或:
1.若第一个操作数为真,则第二个操作数不执行(结果为第一个操作数)
2.若第一个操作数为假,则结果为第二个操作数
逻辑与:
1.若第一个操作数为假,则第二个操作数不执行
2.若第一个操作数为真,则结果为第二个操作数
1. console.log(true||false);
var a=5;
var b=4;
var c=a>=b||(a++)>b;
var c=a<=b||5;
var c=1||2;
var c=0||5;
console.log(c);
console.log(a,b,c);
2. var a=5;
var b=4;
var c=a>=b&&(a--)>b;
var c1=a<=b&&(a--)>b;
console.log(a,b,c);
console.log(a,c1);
console.log(a&&b);
</script>
</body>
</html>