目录
一、js组成
ECMAscript:语法规范,如何定义变量,数据类型有哪些;
DOM:Document Object Model :文档对象模型;
BOM:Browser Object Model:浏览器对象模型。
注:引号规定 => 外双内单
二、变量
1.外链引用css和js
css:<link rel="stylesheet" href="demo.css">
js:<script src="demo.js">
2.变量命名规范
变量以字母,数字,下划线,$组成。(但不能以数字开头)
驼峰命名法:第一个单词首字母小写,其他单词首字母大写。
3.变量交换
var a=10 , b=20;
3.1 借助第三方变量:temp=a ; a=b ; b=temp;
3.2 用于数字交换:a=a+b ; b=a-b ; a=a-b;
4.基本数据类型
number , string , boolean , null , undefined ;
5.typeof 变量名获取数据类型
获取变量的数据类型:typeof (变量 ) 或 typeof 变量名 ----- 推荐使用;
注:用typeof 返回null得到的是object类型;
test:
undefined和一个数字进行相加计算,结果是NaN;
undefined和一个字符串进行相加计算,结果是undefined和字符串的拼接;
var num;
console.log(num); //undefined
console.log(num + 10); //NaN
console.log(num + "String"); //undefinedString
var age;
console.log(age + 'string');//undefinedstring
console.log(age + '10');//undefined10
console.log(age + true);//NaN
console.log(age + false);//NaN
console.log(age + null);//NaN
console.log(age + undefined);//NaN
总结:undefined 与 五种数据类型进行"+",除了string进行拼接,其他都为NaN。
不要拿小数和小数相加得到的结果去验证小数:
var x = 0.1;
var y = 0.2;
var sum = x + y;
console.log(sum);//0.3000000004
console.log(sum == 0.3);//false
console.log(0.3 == 0.3);//true
不要拿NaN验证是否是NaN:
var age;
console.log(age + 10 == NaN);//false
console.log(age + 10 == age + 10);//false
console.log(NaN == NaN);//false
三、数据类型
NaN:not a number 不是一个数字
is NaN:是,不是一个数字
<script>
var number;
document.write(isNaN(number));//true
document.write(isNaN(10));//false
</script>
转义字符:
\t:tab键,制表位
\n:换行
\ : 转实际意义
var str1="我还想再活\"五百年\"";
var str2="我在\"中职通\'挖矿\'\"";
console.log(str1);//我还想再活“五百年”
console.log(str2);//我在“中职通‘挖矿’”
拼接:
两边数字,相加做算术运算;
两边字符串,进行拼接;
规律:字符相连,数值相加
注:“ + ”进行拼接,“-” “ * ” “%” “/” 会进行隐式转换,自动把字符串转为数字类型
var a=10;
var b="5";
console.log(a-b);//输出结果:5
数据类型转换:
parseInt() 从左到右依次进行转换,且只转换整数,遇到字母即停止,已转换好的则返回,若第一位不是数字则返回NaN;
parseFloat() 从左到右依次进行转换,可转换成小数,遇到字母即停止,已转换好的则返回,若第一位不是数字则返回NaN;
若paseFloat() 出现两个小数点,则第二个小数点及其后面的数据将被舍弃;
parseFloat() 不能使用八进制和十六进制,否则其前导0被舍弃;
若小数点后面全为0,则输出时,小数点及其后面的0被舍弃;
console.log(parseInt("10"));//10
console.log(parseInt("10.99"));//10
console.log(parseInt("dbcusdbc"));//NaN
console.log(parseInt("10mclkds"));//10
console.log(parseInt("10.99dsedn"));//10
console.log(parseFloat("10"));//10
console.log(parseFloat("10.99"));//10.99
console.log(parseFloat("dbcusdbc"));//NaN
console.log(parseFloat("10mclkds"));//10
console.log(parseFloat("bfs10sfwn"));//NaN
console.log(parseFloat("10.99dsedn"));//10.99
console.log(parseFloat("10"));//10
console.log(parseFloat("10.5.6"));//10.5
console.log(parseFloat("0806"));//806
console.log(parseFloat("10.00"));//10
Number() 把对象的值转换为数字,若有其他类型则返回NaN;(对象必须先定义,Number ( ) 括号内为对象名)
var test1 = new Boolean(true);
var test2 = new Boolean(false);
var test3 = new Date();
var test4 = new String("999");
var test5 = new String("999 666");
console.log(Number(test1));//1
console.log(Number(test2));//0
console.log(Number(test3));//返回1970.1.1至今的毫秒数
console.log(Number(test4));//999
console.log(Number(test5));//NaN
其他类型转换为字符串:
.toString()
String()
区别:前者不能转换null和undefined,而后者可以。
var a=10;
console.log(a);//10
console.log(a.toString());//10
console.log(typeof a.toString());//string
var a=10;
var b=null;
var c;
console.log(a);//10
console.log(String(a));//10
console.log(String(b));//null
console.log(String(c));//undefined
console.log(typeof a);//number
console.log(typeof b);//object
console.log(typeof c);//undefined
其他类型转换为布尔类型(结果为true或false):
五种为false的情况:0,“ ”,NaN,null,undefined;其他都为true;
var a="胡歌";
var b=20;
var c=null;
var d;
console.log(Boolean(a));//true
console.log(Boolean(b));//true
console.log(Boolean(c));//false
console.log(Boolean(d));//false
console.log(Boolean(1));//true
console.log(Boolean(0));//false
console.log(Boolean(-1));//true
四、运算符
1.算术运算符
包括 + ,- ,*, /,%(取余或取模):
var x = 10;
var y = 5;
console.log(x + y);//15
console.log(x - y);//5
console.log(x * y);//50
console.log(x / y);//2
console.log(x % y);//0
console.log(10 % 3);//1
2.逻辑运算符
包括逻辑与 && 逻辑或 || 逻辑非 !:
// 逻辑非 ! 作用 ---- 取反
console.log(!true);//false
console.log(!false);//true
// 总结:非真即假,非假即真 --- 取反
// 逻辑与 &&
console.log(true && true);//true
console.log(true && false);//false
console.log(false && true);//false
console.log(false && false);//false
// 总结:逻辑与 && 只要有一个为假false,都为假false,除非两个同时为真true,才会为真true
// 逻辑或 ||
console.log("================");
console.log(true || true);//true
console.log(true || false);//true
console.log(false || true);//true
console.log(false || false);//false
// 总结:逻辑或 || 只要有一个为真true,都为真true,除非两个同时为假false,才会为false
3.关系运算符或比较运算符
总结:把true当1看,把false当0看;
// test:
console.log(2 == '2') //true -- 隐式转换
console.log(2 === '2') //false -- 全等比较的是类型
console.log(3 - '2') //1 -- 字符串隐式转换为数字
console.log(1 == true) //true
console.log(2 == true) ->console.log( 2== 1) //false !!!
console.log(0 == false) //true
4.一元运算符
++后置:先运算,后自加
var num=10;
var sum=num++ +10;
console.log(sum);//10+10=20
console.log(num);//11
++前置:先自加,后运算
var num=10;
var sum=++num+10;
console.log(sum);//11+10=21
console.log(num);//11
22/11/03 面试:
var a=0;
console.log(a++);
// 0
test:
var a=1;
var b=++a + ++a;
console.log(b);//b=2+3=5
var a=1;
var b=a++ + ++a;
console.log(b);//b=1+ ++2=4
var a=1;
var b=a++ + a++;
console.log(b);//b=1+2=3
var a=1;
var b=++a + a++;
console.log(b);//b=2+2=4
5.复合运算符
赋值运算符:=,+=,-=,*=,/=,%=;
优先级:
1. ()
2. 一元运算符 ++ -- !
3. 算术运算符 先乘除后加减
4. 关系运算符 > >= < <=
5. 相等运算符 == != === !==
6. 逻辑运算符 先&&后||
7. 赋值运算符 = += -= *= /= %=
test:
var a=(4 >= 6 || '人' != '阿凡达' && !(12*2==144) && true);
console.log(a);
// false || true && true && true -> true
var num=10;
var b=(5 == num / 2 && (2 + 2 * num).toString() === '22');
console.log(b);
// true && true -> true