JavaScript(第二天)—爱创课堂专业前端培训
一、Math对象
JS中对象:内置对象、宿主对象、自定义对象
对象是属性与功能的集合。例如把张三看做是一个对象,那么他有身高、体重等等特征,那么这就是属性;还有吃饭、学习、救人的功能,这就是方法。
属性和方法的调用
对象.属性
对象.方法()
Math对象属于内置对象,用来执行数学运算
Math对象的属性:
PI返回圆周率,3.1415926...
Math对象的方法:
abs()返回绝对值
ceil()向上舍入
floor()向下舍入
round()四舍五入
max()获取几个值中的最大值
min() 获取几个值中的最小值
random()获取0-1之间的随机数
pow(x,y)返回x的y次幂
sqrt()返回数的平方根
// Math将自己本身作为对象,来直接调用属性和方法
// 获取圆周率 PI
console.log(Math.PI);// ==> 3.141592653589793
// abs() 获取绝对值
console.log(Math.abs(-10)); //==> 10
console.log(Math.abs(-10.12)); //==> 10.12
// round() 获取四舍五入的值
console.log(Math.round(10.23));// ==> 10
console.log(Math.round(-10.23));// ==> -10 负号后面的值四舍五入之后,再将负号添加上去
console.log(Math.round(10.83));// ==> 11
console.log(Math.round(-10.83));// ==> -11
console.log(Math.round(-1.2));// ===> -1
// ceil() 向上取整
console.log(Math.ceil(10.23));// ==> 11
console.log(Math.ceil(-10.23));// ==> -10
console.log(Math.ceil(10.83));// ==> -11
console.log(Math.ceil(-10.83));// ==> -10
// floor() 向下取整
console.log(Math.floor(10.23));// ==> 10
console.log(Math.floor(-10.23));// ==> -11
console.log(Math.floor(10.83));// ==> 10
console.log(Math.floor(-10.83));// ==> -11
// random() 获取0-1之间的随机数
console.log(Math.random());
// 获取0-10之间的随机数
var ranNum = (Math.random() * 10).toFixed(2); /*toFixed(num) 设置保留的小数位数,参数num取值0-20之间,执行的是四舍五入*/
console.log("ranNum:"+ranNum);
// 获取10-20之间随机整数
ranNum= Math.round(Math.random() * (20-10))+10;
console.log("ranNum:"+ranNum);
// 获取50-100之间的随机整数
// pow(x,y) 获取x的y次幂
console.log("2的3次方:"+Math.pow(2,3));//==> 2的3次方:8
console.log("2的100次方:"+Math.pow(2,100));//==> 2的100次方:1.2676506002282294e+30
// sqrt() 获取平方根
console.log("4的平方根:"+Math.sqrt(4));//==> 4的平方根:2
console.log("10的平方根:"+Math.sqrt(10));//==>10的平方根:3.162277660168379
// max() min() 获取一系列数字的最大最小值
console.log("10,20,30,40,1,3,100最大值为:",Math.max(10,20,30,40,1,3,100));//==>10,20,30,40,1,3,100最大值为: 100
console.log("10,20,30,40,1,3,100最小值为:",Math.min(10,20,30,40,1,3,100));//==>10,20,30,40,1,3,100最小值为: 1
1
练习:
1. 获取10-100之间的随机整数
2. 已知圆的半径r为10,求圆的面积。 公式:π*r² 要求最终保留两位小数
3. 已知圆锥的底面半径r为10,圆锥的高度为100,求圆锥的体积。并将这个结果输出到页面
计算圆锥体积的公式是:体积V=1/3πr2*h
二、运算符的介绍
表达式的构成:由运算元 和 运算符组成;
2.1 算术运算符
+ - * / %(取模,取余) ++(自增) --(自减)
// 算术运算符 + - * / %(取模,取余) ++(自增) --(自减)
// 纯数值类型之间运算
// console.log(10+20);
// console.log(10-20);
// console.log(10*20);
// console.log(10/20);
// console.log(10%20);
// 数值类型与字符串类型的运算 + 字符串拼接 除+外,数字字符串会默认转成数值类型进行数学运算
// console.log(10+"20");//1020
// console.log("10"+20);//1020
// console.log("10"+"20");//1020
// console.log(10+"hello");//10hello
// console.log(10+"hello"+20);//10Hello20
// console.log(10-"20");//-10
// console.log(10-"hello"*20);//NaN
// 数值类型与布尔类型 true隐式转换成1 false隐式转换成0
// console.log(10+true);
// console.log(10+false);
// console.log(10-true);
// console.log(10-false);
// console.log(10/true); // 10
// console.log(10/false);// Infinity 无限大
// console.log(10*true);// 10
// console.log(10*false);// 0
// console.log(10%true);//0
// console.log(10%false);//NaN
// null 和 数值类型 null默认转为0进行运算
// console.log(null + 10);//10
// console.log(10 + null);//10
// console.log(10/null);//Infinity
// undefined 和 数值类型 undefined不会进行隐式的转换
// console.log(undefined + 10);//NaN
// console.log(10 + undefined);//NaN
// console.log(10*undefined);//NaN
// NaN 和其它进行运算
// console.log(NaN-10);//NaN
// console.log(NaN+10);//NaN
// console.log(NaN - "Hello");//NaN
// console.log(NaN + "Hello");//NaNHello
// Infinity 和其它进行运算
console.log(Infinity+ "Hello");//InfinityHello
console.log(Infinity+ "10");//Infinity10
console.log(Infinity+ 100);//Infinity
console.log(Infinity/ 100);//Infinity
console.log(Infinity== Infinity);//true
console.log(Infinity=== Infinity);//true
1
前++ 与 后++ 、 前-- 与 后--
var a= 10,
b= 20,
//后++ 先执行赋值运算 在自增1
c= a++,//a++ ==> a = a + 1 // c = 10 a = 11
//前++ 先自增1再进行赋值运算
d = ++b,//++b ==> b = b + 1 // d = 21 b = 21
e = --a,//--a ==> a = a -1 // e = 10 a = 10
f= b--;//b-- ==> b = b -1 // f = 21 b = 20
console.log("a:",a,"b:",b,"c:",c,"d:",d,"e:",e,"f:",f);//a: 10 b: 20 c: 10 d: 21 e: 10 f: 21
1
2.2 比较运算符
> < <= >= == != === !===
面试题:“=”、“==”、“===”区别
“=” 赋值运算符,进行赋值运算
“==”比较运算符,比较的是两边的值是否相同,忽略数据类型
“===”比较运算符,比较的是两边的值和数据类型是否相同
比较运算符比较的结果是一个布尔值
// console.log(10>20);//false
// console.log(10==20);//false
// console.log(10 < 20);//true
// console.log(10 <= 20);//true 10 < 20 或者 10 == 20 有一个满足条件即可
// console.log(20 >= 20);//true
// 纯数值类型和字符串
// console.log(10 == "hello");//false
// console.log(10 == "10");//true
// console.log(10 === "10");//false
// 纯数值与布尔值进行比较
// console.log(20 > true);//true
// console.log(1 == true);//true
// console.log(1 === true);//false
// console.log(true >= false);//true
// console.log(10 >= "hello");//false
// console.log(10 <= "a");//false
// console.log(true < 'A');//false
// console.log(10-"a");//NaN
// console.log(Number('a'));//NaN
// 字符串数字和纯数值类型的比较
// console.log(10 < "20");//true
// console.log(10 < "5");//false
// console.log('16' < '5');//true ASCII码 字符串数字的比较,按照字符串中数字出现的顺序逐一按照ACSII码逐一进行比较
// console.log('20' < 'a');//true
// 特殊的比较
// console.log(NaN == NaN);//false
// console.log(NaN > NaN);//false
// console.log(NaN < NaN);//false
// console.log(NaN < 10);//false
// console.log(Infinity === Infinity);//true
// console.log(Infinity > Infinity);//false
// console.log(null == undefined);//true
// console.log(null === undefined);//false
// console.log(null == 0);//false
// console.log(null == "");//false
1
2.3 逻辑运算符
逻辑与:& &&
逻辑或:| ||
逻辑非 !
&& 、 || 具有短路的效果
&& &两边值同时为真才为真
|| |两边只要有一个为真即为真
特殊情况:
其他非布尔值也可以参与逻辑运算,参与的时候,会自动转换成布尔值进行运算,返回的结果就不一定是布尔值。
NaN、0、null、“”、undefined会转换成false参与运算。
非0 数字、非空字符串都会转成true参与运算
// 逻辑运算符 & && | || !
// & && 两边同时为真才为真
// console.log(true && true);//true 1
// console.log(true && false);//false
// console.log(false && true);//false 0
// console.log(false && false);//false
/*
& 与 && 区别:
&& 具有短路效果,执行效果较高;当左边值为false的时候,直接给出结果false,不再判断右边的值;但是&还会继续判断后面的值
&& 布尔值比较结果 为 true 和 false ; & 布尔值比较结果 0 和 1
*/
// | || 两个有一个满足即满足
// console.log(true || false);//true 1
// console.log(false || true);//true
// console.log(false || false);//false 0
// console.log(true || true);//true
// 逻辑运算符和比较运算符的综合:比较运算符 > 逻辑运算符
// console.log(!true);//false
// console.log(!false);//true
console.log(10> 20&& 20== 30);// false && false
console.log(10<= 20&& 20== "20");//true && true
关注VX公众号“icketang” 免费领取华为荣耀商城项目实战视频教程