1.JavaScript的组成：
ECMAScript标准--基本的语法和对象
DOM:Document Object Model 文档对象模型
BOM：Broswer Object Model 浏览器对象模型
JavaScript：简称JS
2.JS是一门脚本语言：不需要编译
编译：把代码转换成计算机所认知的二进制
JS是一门弱类型语言，声明&变量都用var
JS是一门动态类型语言：认知当前的这个变量到底是什么类型
JS是一门解释性语言
3.Javascript最初的目的：解决浏览器和服务器之间交互的问题
JS现在能做什么？ 交互问题 特效 游戏 服务器端的开发 移动开发
4.HTML：行为 展示信息
CSS：样式 美化页面
JavaScript：结构 实现浏览器和服务器交互，有计算和验证的的能力
5.JS需要注意的问题：
变量有大小写之分;
弱类型语言，声明变量都用var
字符串用单引号或者双引号都可以
每行代码结束用分号
JS代码的位置：
1.内嵌方式，嵌入在html标签中
2.内部引用，直接在页面的script标签中写js代码
3.外部引用，js代码放在一个js文件中，然后在html页面中引入即可
1 异步：多个人做多件事
2 同步：一个人有顺序的做多件事
3
4 script标签中有两个属性：async defer 都输异步
5 async属性的值就是自己：页面加载时就开始下载那个文件，下载完毕后立刻执行
6 defer属性的值就是自己：页面中其他内容全部加载完毕后，他才开始下载并执行
7 一般在html的标签中如果属性和值就是自己，并且只有一个，那么值就可以省略
8
9
10 <script >
11 alert("你是不是傻");
12 alert("你真傻");
13 alert("哈哈哈");
14 </script>
15 <script async="async" src="24cs.js">//异步一般放到一个空标签中，如果标签里面写东西，显示不出来
16 //alert("你是不是傻");
17 //alert("你真傻");
18 //alert("哈哈哈");
19 </script>
交换两个变量的值
1 <script>
2 //交换两个变量的值《必须是数值型的才可以用一下三种方法》
3 //1.第三方变量的方式
4 var num1=10;
5 var num2=20;
6 var temp=num1; //temp 10
7 num1=num2; //num1 20
8 num2=temp; //num2 10
9 console.log(num1,num2);
10
11 //2.使用加减法
12 var num1=10;
13 var num2=20;
14 num1=num1+num2; //num1 30
15 num2=num1-num2; //num2 10
16 num1=num1-num2; //num1 20
17 console.log(num1,num2);
18
19 //3.位运算 异或运算 二进制 不同为1 相同为0
20 var num1=10; //1010 10
21 var num2=20; //10100 20
22 num1=num1^num2; //11110 30
23 num2=num1^num2; // 1010 10
24 num1=num1^num2; //10100 20
25 console.log(num1,num2);
26 </script>
//变量的声明及数据类型
1 <script>
2 //变量名命名的规范：由字母，下划线或者$符号开头，中间包含字母，下划线或者$符号、或者数字；
3 // 变量名要有意义，最好用单词，如果单词不会用拼音，千万不要用简写的方式
4 //变量名都要小写的，如果这个变量名是多个单词组合的，那么第一个单词的第一个字母要小写，后面的单词的第一个字母要大写--驼峰命名法
5
6 //变量声明可以一次性声明多个变量
7 // var num=10,i=10;
8 </script>
9 <script>
10 //JS中的原始数据类型：Number，Boolean，Null，undefined，Object
11 //null类型的值只有一个就是null
12 //undefined类型的值只有一个undefined ---未定义
13 //boolean（bool）布尔类型，值只有两个：true false 1或者0 真或者假
14 //var sex=1;//男
15 // var sex=0;//女
16
17 //什么情况下变量的值为undefined，结果为undefined
18 //如果一个函数没有明确的返回值，接受结果了，也是undefined（讲函数的时候会讲解）
19 var num;
20 console.log(num);//undefined
21
22 var num=null;
23 console.log(num); //null
24
25
26
27 //显示变量的类型用什么? tydeof 两种写法：typeof 变量名，typeof(变量名)
28 var num=10;
29 var str="尤溪";
30 var flag=false;
31 var def;
32
33 var nul=null;//有疑问？
34
35 var obj=new Object();
36
37 console.log(typeof num);//number
38 console.log(typeof str);//string
39 console.log(typeof flag);//boolean
40 console.log(typeof def);//undefined
41
42 console.log(typeof (nul));//object
43 console.log(String(nul));//null
44
45 console.log(typeof obj);//object
46
47 //如果想要使用变量，最好先判断这个变量的类型是不是undefined或者这个变量的值是不是null
48 var def;
49 if(typeof (def)=='undefined'||def==null){
50 console.log("变量没有意义，不能参与运算");
51 }else{
52 console.log("可以使用");
53 }
54
55 console.log(10); //10
56 var num=10;
57 console.log(typeof num); //number
58
59 console.log(undefined+10); //NaN
60
61 // console.log(isNaN(125de));//浏览器报错了
62
63 console.log(isNaN===isNaN);//true 没有意义，千万不要这样写
64
65
66 var num=10;
67 var num2=90.4;
68 console.log(typeof num); //number
69 console.log(typeof num2);//number
70 //如果一个变量的值是 八进制 十进制 十六进制
71 var number=0xc;//0x开头的是十六进制
72 console.log(number);//是以十进制方式输出
73
74 var number=020;//八进制
75 console.log(num1);//以十进制显示
76
77 //不要用小数验证小数
78 var num1=0.1;
79 var num2=0.2;
80 var sum=num1+num2;
81 console.log(sum);//结果不是0.3 结果显示0.30000000000000004
82
83 console.log(Number.MAX_VALUE);//最大值 肯定在比较大小的时候用 结果显示1.7976931348623157e+308
84 console.log(Number.MIN_VALUE);//最小值 结果显示5e-324
85
86
87 //字符串：string类型，可以用单引号也可以用双引号
88 //字符串特性：不可变
89 var str="你好";
90 str[0]="哦";
91 console.log(str);//你好
92 str="我好";
93 console.log(str);//我好
94
95 var str1="你好我好大家好，好好学习，天天向上";
96 console.log(str1.length);//字符串的长度17
97
98 var str1="真";
99 var str2="好";
100 console.log(str1+str2);//真好 +用在两个字符串中间叫拼接也叫连接
101
102 var str1="23";
103 var str2=10;
104 console.log(str2+str1);//2310 +一个字符串和一个数字也是拼接
105
106 var str1="10";
107 var str2=15;
108 console.log(str2-str1);//5 如果是减号,那么字符串中是数字会进行运算
109 </script>
其他类型转布尔类型
1 <script>
2 // 布尔类型:true false
3 console.log(Boolean(10));//true
4 console.log(Boolean(1));//true
5 console.log(Boolean(0));//false
6
7 console.log(Boolean("hi"));//true
8 console.log(Boolean(""));//空字符串 false
9 console.log(Boolean(" "));//true
10
11 console.log(Boolean(undefined));//false
12 console.log(Boolean(null));//false
13
14 var obj=new Object();//创建对象
15 console.log(Boolean(obj));//true
16
17 var obj=new Object();//创建对象
18 obj=null;
19 console.log(Boolean(obj));//false
20 </script>
数据类型
1 <script>
2 /*数据类型转换
3 其他类型转数字类型
4 其他类型转字符串类型
5 其他类型转布尔类型*/
6 //其他类型转数字类型---Number(变量) parseInt(变量) parseFloat(变量)
7 console.log(parseInt("23"));//23
8 console.log(parseInt("23.5"));//23
9 console.log(parseInt("23rf"));//23
10 console.log(parseInt("fe23"));//NaN
11 console.log(parseInt("23.8.9"));//23
12 console.log(parseInt(true));//NaN
13 console.log(parseInt(null));//NaN
14
15 console.log( parseFloat("23"));//23
16 console.log( parseFloat("23.5.6"));//23.5
17 console.log( parseFloat("fd23.5"));//NaN
18 console.log( parseFloat("23.9fdf"));//23.9
19 console.log( parseFloat("000023"));//23
20
21
22 console.log(Number("45"));//45
23 console.log(Number("45.5"));//45.5
24 console.log(Number("045"));//45
25 console.log(Number("45.5.6"));//NaN
26 console.log(Number("45f"));//NaN
27 console.log(Number("f45"));//NaN
28
29 //其他类型转字符串类型
30 var num=10;
31 console.log(num);//10
32 console.log(typeof num.toString());//string
33
34 var num;
35 console.log(num.toString());
36 console.log(String(num));
37
38 var num=null;
39 console.log(typeof num.toString());
40 console.log(typeof String(num));
41
42 </script>
运算符
2
3 <script>
4 //算术运算符：+ - * / %
5 //算术运算符：首先是一个表达式，有算术运算符连接起来的表达式
6 //一元运算符：++ -- ++num num++ --num num--
7 //只有一个操作符可以运算
8 //一元运算表达式：有一元运算符连接起来的表达式
9 //三元运算符： ？ ：
10
11 //复合运算符：+= -= *= /+ %=
12 //比较运算符：> < >= <= == === != !==
13 //比较运算符表达式的结果是布尔类型
14 //逻辑运算符：&&逻辑与 ||逻辑或 ！逻辑非
15 //逻辑运算符表达式的结果为布尔型
16 //表达式1&&表达式2---》结果：有一个为false，整个结果为false
17
18 //表达式1||表达式2--->结果：有一个为true，整个结果为true
19 //！表达式1--->结果：如果表达式1为true，则结果为false，否则相反
20
21 var obj=new Object();
22 var flag=true&&obj;
23 console.log(flag);//Object
24
25 // 后+ num++ 如果参与运算,先计算,计算后再加1
26 // 前+ ++num 如果参与运算,先加1,后计算
27 var num1=10;
28 var num2=++num1 +10;
29 console.log(num2);//21
30 console.log(num1);//11
31
32
33 </script>
分支结构
1 <script>
2 //流程控制：控制代码执行的顺序
3
4 //顺序结构：代码从上到下，从左到右(有时候从右向左)执行
5 //分支语句：if语句 ，if-else语句，if-else if-else if.. else语句，switch-case语句，三元表达式
6 //循环语句：while循环 ，do-while循环，for循环，for-in循环
7 </script>
1 //分支语句：if语句 ，if-else语句，if-else if-else if.. else语句，switch-case语句，三元表达式
2
3 /*
4 * if语句：
5 * 语法：
6 * if(表达式){
7 * 代码段
8 * }
9 * 执行过程：先判断表达式的结果是true还是false，如果是true则执行里面的代码段，否则不执行大括号里面的代码，直接跳过，直接执行下面的内容
10 * 举例：判断年龄是否大于等于18，如果为真则提示你已经成年了
11 **/
12 var age=18;
13 if(age>=18){
14 console.log("你已经成年了");
15 }
16
17
18 /*
19 * if-else语句：
20 * 语法：
21 * if(表达式){
22 * 代码1
23 * }else{
24 * 代码2
25 * }
26 * 执行过程：如果表达式的结果为true则执行代码1，否则执行代码2
27 *
28 * 举例：如果年龄大于等于18，提示你已经成年了。否则提示你未成年
29 * */
30 var age=45;
31 if(age>=18){
32 console.log("你应经成年了");
33 }else{
34 console.log("你未成年");
35 }
36
37
38 /*
39 * 三元表达式的语法和执行过程：
40 * 表达式1?表达式2：表达式3；
41 * 举例：
42 * */
43 var age=19;
44 var result=age>=18?"你成年了":"你未成年";
45 console.log(result);
46
47 var num1=10;
48 var num2=20;
49 var num3=30;
50 var max=num1>num2?(num1>num3?num1:num3):(num2>num3?num2:num3);//30
51
52 /**
53 * if-else if-else:可以有多个else if
54 * 语法：
55 * if(表达式1){
56 * 代码1
57 * }else if(表达式2){
58 * 代码2
59 * }else if(表达式3){
60 * 代码3
61 * }else{
62 * 代码4
63 * }
64 * 执行过程：判断表达式1的结果，如果为true则执行代码1，否则执行表达式2，如果为true则执行代码代码2，否则执行表达式3，如果为true，则执行代码3，否则执行代码4
65 * 例子：
66 *获取数学成绩,如果成绩大于90分小于100分则提示您的级别为A
67 * 如果成绩在80-90(包含)之间则提示级别为B
68 * 如果成绩在70-80(包含)之间则提示级别为C
69 * 如果成绩在60-70(包含)之间则提示级别为D
70 * 如果成绩在60以下的(包含)之间则提示级别为E
71 */
72 var score=50;
73 if(score>90&&score<=100){
74 console.log("A");
75 }else if(score>80){
76 console.log("B");
77 }else if(score>70){
78 console.log("C");
79 }else if(score>60){
80 console.log("D");
81 }else{
82 console.log("E");
83 }
84
85 //如果有一个分支就用if
86 //如果有两个分支则用if-else
87 //如果有多个分支可以用if-else if语句
88
89 /*
90 * switch-case语句：
91 * switch(表达式){
92 * case 值1：代码1；break；
93 * case 值2：代码2；break；
94 * case 值3：代码3；break；
95 * case 值4：代码4；break；
96 * default：代码5；break；
97 * }
98 *
99 * 执行过程：获取表达式的值，和值1相比，如果匹配，则执行代码1，遇到break，整个switch-case语句结束，否则对比值2，匹配则执行代码2，以此类推，如果表达式的结果和case后面的值都不匹配则执行代码5
100 *
101 * 注意：switch后面的小括号里的表达式的值在和case后面的值对比的时候使用的是严格模式
102 * switch-case语句中的default可以省略
103 *
104 * 举例：根据级别显示相应的分数
105 *
106 * */
107 var jiBie="C";
108 switch (jiBie){
109 case "A":console.log("90-100之间");break;
110 case "B":console.log("80-90之间");break;
111 case "C":console.log("70-80之间");break;
112 case "D":console.log("60-70之间");break;
113 default:console.log("不及格");break;
114 }
115 //根据时间判断今天的星期
116 var dt=new Date().getDay();
117 switch (dt){
118 case 1:console.log("星期一");break;
119 case 2:console.log("星期二");break;
120 case 3:console.log("星期三");break;
121 case 4:console.log("星期四");break;
122 case 5:console.log("星期五");break;
123 case 6:console.log("星期六");break;
124 case 0:console.log("星期日");break;
125 }
126
127
128 var num=31;
129 switch (num){
130 case 31:console.log("1月份");
131 case 31:console.log("3月份");
132 case 31:console.log("5月份");break;
133 case 30:console.log("4月份");break;
134 }
135 </script>
1 //循环:一件事不停的做. 同一行代码不停的执行,执行多次
2 //循环结构: while循环,do-while循环,for循环,for-in循环
3
4 /*
5 *
6 * while循环
7 *
8 * 语法:
9 *
10 * var i=0;//计数器--记录循环的次数
11 * while(表达式){
12 * 循环体---代码
13 * i++;
14 * }
15 * 执行过程:
16 * 先判断表达式是否成立,不成立则直接跳过循环
17 * 如果成立,则执行循环体,然后i++,之后回到表达式,继续判断表达式是否成立,如果成立则继续循环,否则跳出循环
18 */
1 /*
2 * while循环：
3 * var i=0;
4 * while(判断条件){
5 * 代码；
6 * i++;
7 * }
8 * while循环特点：先判断，后执行，有可能一次循环都不执行
9 *
10 *
11 * do-while循环
12 * 语法：
13 * do{
14 * 代码
15 * }while(表达式);
16 * 执行过程：先执行一次代码，再判断条件是否成立，不成立则跳出循环，成立则继续执行
17 * 特点：先执行一次代码，后判断，至少执行一次代码
18 * */
19 //举例：账号和密码
20 var userName="";
21 var userPwd="";
22 do{
23 userName=prompt("请输入你的账号:");
24 userPwd=prompt("请输入你的密码：");
25 }while(userName!="admin"||userPwd!="123456");
26 console.log("登陆成功了");
break和continue
1 <script>
2 //break:跳出当前循环
3 //continue：继续下一个循环
4 //求100-200之间第一个能被7整除的数
5 var i=100;
6 while(i<=200){
7 if(i%7==0){
8 console.log(i);//显示能被7整除的数
9 break;//跳出当前循环
10 }
11 i++;
12 }
13
14 //求1-100之间所有的奇数的和---请您使用continue
15 var i=1;
16 var sum=0;
17 while(i<100){
18 if(i%2!=0){
19 sum+=i;
20 i++;
21 continue;//在循环遇到了continue，那么后面的代码不执行，直接跳到循环的条件的那个位置继续下一次循环
22 }
23 i++;
24 }
25 console.log(sum);
26 </script>