小白学js第三天
目录
数据类型
- 简单的数据类型
- 复杂的数据类型
- 获取变量类型
- javascript是弱类型语言
- 注释
数据类型的转换
- 转换成字符串类型
- 转换成数值类型
- 转换成布尔类型
运算符（operator）
- 表达式
- 数学运算符
- 一元表达式
- 逻辑运算符
- 关系运算符
- 赋值运算符
- 运算符的优先级
数据类型脑图请戳☟[http://naotu.baidu.com/file/4d6b9b4921afd2a681a93be9820b4706?token=cde8ffba086e3912]
运算符脑图请戳☟[http://naotu.baidu.com/file/2c446827e13d3dbd74c66f529d902510?token=e550aabc69be2c6a]
那么就正式正式开始啦
1.1 简单的数据类型
1.1.1 Number类型
1.1.1.1 数值字面量
数值的固定表示法 eg. 1024 100 111
1.1.1.2 进制
1.1.1.2.1 十进制
- 数字序列范围 0-9
- 进行算术运算时，八进制，十六进制都会转化成十进制进行计算
1.1.2.2 十六进制
- 数字序列范围 0-9 A-F A 10 B 11 C 12 D 13 E 14 F 15
- 给变量赋值时 以0x开头
1.1.1.2.3 八进制
- 数字序列范围 0-7
- 给变量赋值时 以0开头
1.1.1.3 浮点数
- 注意精度问题
- 浮点数值的最高精度是 17 位小数，但在进行算术计算时其精确度远远不如整数
var result = 0.2 + 0.1;
console.log(result);
//输出的结果是0.30000000000000004 而不是0.3
//不要判断两个浮点数是否相等
- 可用科学记数法来表示
var n = 5e-324; // 科学计数法 5乘以10的-324次方
1.1.1.4 数值范围
-
最大值 （Number.MAX_VALUE）
-
最小值（Number.MIN_VALUE）
-
无穷大 （整数/0）
-
无穷小 （整数/-0）
1.1.1.5 数值的判断
1.1.1.5.1 NAN
- not a Number
var result = 5 * 'abc';
console.log(result); // NAN
与任何值都不相等,包括他本身
1.1.1.5.2 isNaN
- is not a number；
var num = 1;
console.log(isNaN(num));//返回false
var str = '123;
console.log(isNaN(str));//返回false
var msg = 'abc';
console.log(isNaN(msg));//返回true
判断数值是否是数字，若是数值返回false，若不是数值返回true
1.1.2 String类型
1.1.2.1 String的字面量
用‘’或“”括起来的字符
1.1.2.2 用的转义字符
\t //制表符
\n //换行符
\\ //打印\
\' // 打印一个单引号
\ " // 打印一个双引号
\b //空格
\r //回车
1.1.2.2 用.length获取字符串长度
// 案例1
var str = '1325884565'；
console.log(str.length);// 字符串的长度为10
// 案例2
var msg = '我爱\'\"黑马程序猿\"\'';
console.log(msg.length); // 字符串的长度为11；
1.1.2.3 用 + 进行字符串拼接
- 如果+两边的都是String类型， 则 + 起拼接作用
// 字符串的拼接
//案例一
var str1 = 'I';
var str2 = 'Love';
var str3 = 'You';
console.log(str1 +'\b' + str2 + '\b' + str3);//输出ILoveYou
- 如果+两边是Number类型，则+起运算作用
//案例二
var num = 1;
var num1 = 2;
console.log(num + num1);// 返回结果3
- 如果+两边一个是String类型一个是其他类型，那么浏览器会先把其他类型转换为String类型然后再进行拼接
//案例三
var msg = 'I love you 用数字代表是：';
var num = 520;
console.log(msg + num); //返回结果为 I love you 用数字代表是：520
1.1.3 Boolean类型
1.1.3.1 Boolean的字面量
- true和false， 区分大小写
- 在计算机存储中 true为1，false为0
1.1.4 Null类型
null表示一个空，如果要是变量的值为null必须手动设置
1.1.5 undefined类型
- 表示一个声明了但是没有赋值的变量
- 变量只声明时，默认是undefined
1.2 复杂的数据类型
object类型
以后写，写了之后会把链接附上☺
1.3 用typeof获取变量类型
//案例一
var num = 1;
console.log(typeof(num));//返回值是number
//案例二
var str = '1';
console.log(typeof(str));//返回值是string
//案例三
var msg = true;
console.log(typeof(msg));//返回值是boolean
1.4 javascript是弱类型语言
- 在javascript中声明变量的时候并没有确定变量的类型
- 在代码执行的过程中会确定变量的类型
1.5 注释
1.5.1 单行注释（//）
用 // 表示，只能注释一行指令
//案例
// var str = '1';
// console.log(typeof(str));//返回值是string
1.5.2 多行注释（/* 注释的消息*/）
- /*
- 所需要注释的消息
- */
//案例
/*
var msg = true;
console.log(typeof(msg));//返回值是boolean
*/
2.1 转换为字符串类型
在谷歌浏览器中，字符串的颜色是黑色的，数值类型是蓝色的，布尔类型也是蓝色的，undefined和null是灰色的
2.1.1 .toString（）
//案例
var num = 5;
console.log(num.toString());// 返回5的颜色是黑色
2.1.2 .String()
String()函数存在的意义：有些值没有toString()，这个时候可以使用String()。比如：undefined和null
//案例
var num= 1;
console.log(String(num));// 返回1的颜色是黑色
2.1.3 用 + 拼接
见String类型中的 1.1.2.3
2.2 转换为数值类型
2.2.1 Number（）
//案例一
var msg = '123abc';
console.log(Number(msg));// 返回NaN
//返回NaN的原因是利用Number（变量名）方法把其他类型转换成数值类型时，如果要转换的字符串中有一个不是数值的字符，返回NaN
//案例二
var msg = '123';
console.log(Number(msg)); // 返回123
2.2.2 parseInt()
- 可以把任何值转换为数值，如果第一个字符是数值会解析到非数值结束
- 如果第一个字符不是数字或者符号就返回NaN
//案例一
var msg = '123abc';
console.log(parseInt(msg)); // 返回123
// 案例二
var msg = 'abc123';
console.log(parseInt(msg)); // 返回NaN
2.2.3 parsefloat()
- parseFloat()把字符串转换成浮点数
- parseFloat()和parseInt非常相似，不同之处在于：parseFloat会解析第一个. 遇到第二个.或者非数字结束
var msg = '123abc';
var num = 123.12;
var istrue = true;
var str = '123.123.12bb'
console.log(parseFloat(msg)); //返回123
console.log(parseInt(num)); // 返回123
console.log(parseFloat(istrue)); //返回 NaN 说明parseFloat无法转换Boolean类型
console.log(parseFloat(str));// 123.123
2.2.4 取正和取负和-0等运算
var str = '500';
console.log(+str); // 取正
console.log(-str); // 取负
console.log(str - 0);
2.3 转换成Boolean类型
- 0 ''(空字符串) null undefined NaN 会转换成false 其它都会转换成true
var num = 123;
console.log(Boolean(num)); //true
var str = '123abc';
console.log(Boolean(str)); //true
var msg = null;
console.log(Boolean(msg)); //false
var isTrue = true;
console.log(Boolean(isTrue)); //true
3.1 表达式
- 由操作数和运算符组成，并且会返回一个值
- eg. 5 + 6 = 11； 5 6 是操作数 +是操作符 11是返回值
3.2 数学运算符
- 加（+）
- 减（-）
- 乘（*）
- 除（/）
- 取余（%）
3.3 一元运算符（自增 自减）
一元运算符：只有一个操作数的运算符（eg.5 + 6 两个操作数的运算符 二元运算符）
3.3.1 自增
3.3.1.1 前置++
- 自身先+1，再做运算
var num = 5;
console.log(++num); //6
console.log(num); //6
3.3.1.2 ++后置
- 先做运算，再自身+1
var num = 5;
console.log(num++); // 5
console.log(num); //6
3.3.2 自减
3.3.2.1 前置--
- 自身先-1，再做运算
var num = 5;
console.log(--num); //4
console.log(num); //4
3.3.2.2 --后置
- 先做运算，再自身-1
var num = 5;
console.log(num--); // 5
console.log(num); //4
// 小练习：
var a = 1;
var b = a++ + ++a;
//a++ -> 1
//a=2 ++a -> 3
//b= 1 + 3 = 5
console.log(b);
var a = 1;
var b = ++a + ++a;
// ++a -> 2
// a = 2 ++a => 3 2+3=5
console.log(b);
var a = 1;
var b = a++ + a++;
// a++ -> 1
// a = 2, a++ -> 2, 1+2=3
console.log(b);
var a = 1;
var b = ++a + a++;
// ++a -> 2;
// a = 2, 2+2=4
console.log(b);
3.4 逻辑运算符（与、或、非）
3.4.1 与（&&）
- （条件表达式）&&（条件表达式） 的两边同时为true 才返回true
3.4.2 或 （||）
- （条件表达式）||（条件表达式） 的两边同时为false 才返回false
3.4.3 非（！）
- ！是一元表达式
- 取反（eg. ！true 返回 false， ！false 返回 true）
3.5 关系运算符
3.5.1 >、<、>=、<=、==、 !=
- == 判断两个变量的值是否相等
- ！= !=判断两个变量的是否不等
3.5.2 === 、!==
- === 判断两个变量值和类型是否都相等（先判断类型再判断值）
- !== 判断两个变量值和类型是否不相等（先判断类型再判断值）
== 与 =的区别：只进行值得比较，===类型和值同时相等，则相等
var result = '55' == 55; // true
var result = '55' === 55; // false 值相等，类型不相等
var result = 55 === 55; // true
3.6 赋值运算符
- =
- +=
- -=
- *=
- /=
- %=
var num =3;
num += 1;
//num = num + 1; //num += 1 == num = num + 1;
console.log(num);
3.7 运算符的优先级
优先级从高到底
- () 优先级最高
- 一元运算符 ++ -- !
- 算数运算符 先* / % 后 + -
- 关系运算符 > >= < <=
- 相等运算符 == != === !==
- 逻辑运算符 先&& 后||
- 赋值运算符
//小练习
/ // 练习1：
console.log(4 >= 6 || '人' != '阿凡达' && !(12 * 2 == 144) && true);
//第一步 （4 >= 6 ）|| ('人' != '阿凡达')&& !(12 * 2 == 144)&& true
//第二步 先计算括号里面的，结果为：false || false || true && true
//第三步 从左到右依次计算，结果为true
// 练习2：
var num = 10;
console.log(5 == num / 2 && (2 + 2 * num).toString() ==='22');
//第一步 （5 == 10 / 2）&&(2 + 2 * 10).toString() === '22')
//第二步 先计算括号里面的，true&& true
//第三步 从左到右依次计算，结果为true