JavaScript 基础——使用js的三种方式，js中的变量，js中的输出语句，js中的运算符；js中的分支结构
JavaScript
1、是什么：基于浏览器 基于（面向）对象 事件驱动 脚本语言
2、作用：表单验证，减轻服务器压力
添加野面动画效果
动态更改页面内容
Ajax网络请求 （）
3、组成部分：ECMAScript() DOM(文档对象模型document) BOM(浏览器对 象模型)
ECMAScript:语法 变量和数据类型 运算符 逻辑控制语句 关键 字、保留字 对象
4、基本结构：<script type="text/javascript">
语句
</script>
变量：变量名由字母数字下划线$符号组成。开头不能
<!--[使用js的三种方式]
1、html标签中内嵌js;
2、html页面中直接使用js：
<script type="text/javascript">
//js代码
</script>
3、引用外部js文件：
<script language="JavaScript" src="js文件路径"></script>
【注意事项】
① 页面中js代码与引用js代码，可以嵌入到html页面的任何位置。但是，位置不同会影响到js代码的
执行顺序。
例如：<script>在body前面，会在页面加载之前执行js代码。
② 页面中js代码，使用type="text/javascript"
引用外部的js代码文件，使用language="JavaScript"
③ 引用外部js文件的<scritp></scritp>标签必须成对出现，且标签内部不能有任何代码。
-->
/*[js中的变量]
* 1、js中变量声明的写法；
var width=10; 使用var声明的变量，只在当前的函数作用域有效
width1=11; 不使用var，直接赋值生成的变量，默认为全局变量，整个js文件有效。
var a,b,c,=1;//同一声明语句同时声明多个变量，变量之间用英文逗号分隔，但赋值要单独赋值
，例如上式中只有c赋值为1 a/b为undefined（未定义）
[声明变量注意事项]
① js中所有变量类型的声明，均使用var关键字。变量的具体数据类型，取决于给变量的赋值执行
② 同一变量，可以在多次不同赋值时，修改变量的数据类型；
var width=10； //width为整形
width="哈哈"；//width改为字符串类型；
③ 变量可以使用var声明，也可以省略var。【区别】不使用var 默认为全局
④ 同一变量名，可以多次用var声明。但是没有任何含义，也不会报错。第二次之后的声明，只会被
理解为未赋值。
* 2、变量的命名规范；
① 变量名只能有字母数字下划线和$组成；
②开头不能是数字
③ 变量区分大小写，大写与小写为不同变量；
* 3、变量要符合驼峰法则；
变量开头为小写，之后每个单词首字母大写；(或单词之间用下划线分开)；
LiuMengHenPiaoLiang
liu_meng_hen_piao_liang
4、js中的变量的数据类型
undefined：未定义，用var声明的变量，没有进行初始化赋值var a;
null：表示空值;例如，空的对象，空的数组，
boolean：真假，可选值 true/false
number：数值类型。可以是小数也可以是整数。
string：字符串；用"" 或'' 包裹的内容，成为字符串
object：对象（复杂数据类型）
5、常用的数值函数：
① isNaN：用于判断一个变量或常量，是否为NaN(非数值)
使用isNaN判断时，会尝试使用Number（）函数进行转换，如果能转换为数字，则不是非数值
，结果为false.
"111" 纯数字字符串，false ；"" 空字符串，false; "1a"包含其他字符，true;
true/false 布尔类型，false；
② Number（）:将其他类型转换为数值类型。
【字符串类型转数值】
>>>字符串为纯数值字符串会转为对应的数字"111"->111
>>>字符串为空字符串时，会转为0 ""
>>>字符串包含其他非数字字符时，不能转换，直接赋值。
【布尔Boolean类型转数值】
true->1 false->0
【null/undefined 转数值】
null->0 undefined->NaN
【object 类型转数值】
*先调用ValueOf方法，确定函数是否有返回值，再根据上 述各种情况判断。
*
③ parseInt:将字符串转换为数值类型；
>>>空字符串不能转。结果为NaN;
>>>纯数字字符串，能转。"123"->123 ; "123.5"->123;(小数转换时直接抹掉小数点，不四舍五入)
>>>包含其他字符的字符串。会截取第一个非字符串前的数值部分。
"123a456"->123;"a123456"->NaN
>>>parseInt只能转string（字符串）Boolean/null/undefined 均为NaN
④ parseFloat:将字符串转换为数值类型；
>>>使用方式同parseInt，但是当转换小数字符串时，保留 小数点；转换整数时，保留整数。
"123"->123 ; "123.5"->123.5;
⑤ typeof:用来检测变量数据类型；
未定义->undefined 字符串->string true/false->Boolean
数值->Number 对象/null->object 函数->function
数据类型
undefined
null：空值
boolean：内容显示对错
number：数字
string：字符串
object：对象（复杂数据类型）
*/
var width;//声明变量
width1=11; //给变量赋值
alert(width);
var width=10; //声明变量的同时，直接赋值
var x=8,y=9,z=10;
alert(x)
/*
【js中的输出语句】
* document.write()；
* 输出语句，将write的（）中的内容打印在浏览器屏幕上；
* 使用时注意：除变量/常量以外的任何内容，打印时必须""中。变量/常量必须放到""外。
* 打印内容同时有多部分时之间用+链接
* 例如：document.write("左手中的纸牌："+left+"<br />")
*
* alert();
* 弹窗警告，()中的使用方式同上。
* */
//左手换右手的数字
var left=10
var right=8
document.write("<h3>输出互换前手中的纸牌：</h3>");
document.write("左手中的纸牌："+left+"<br />");
document.write("右手中的纸牌："+right+"<br /><br />");
var center;//声明一个中间变量
center=left;//左手的值给中间变量
left=right;//把右手的值给左手
right=center//把中间的值给右手
document.write("<h3>输出互换后手中的纸牌：</h3>");
document.write("左手中的纸牌："+left+"<br />");
document.write("右手中的纸牌："+right+"<br /><br />");
js中的运算符1、 算术运算+ 加、- 减、* 乘、 / 除、 % 取余、++ 自增、-- 自减 +:有两种作用，链接字符串/加法运算；当加号两边均为数字时，进行加法运算；当加号两边有任意一边为字符串进行字符串连接，连接之后结构仍为字符串。++：自增运算符，将变量在原有基础上+1--：自减运算符，将变量在原有基础上-1 【n++与++n】n++:先使用n的值进行计算，然后再把n+1；++n:先把n的值+1，然后再把用n+1的值去运算； 相同点：不论n++还是++n,在执行完代码以后，均会把n+1例如：var a=3;var b,c;b= a++ +2; //a=3 b=6 a=4c= ++a +2; //a=4 a=5jj 2、 赋值运算= 赋值、 += -= *= /= %= +=：a+=5;相当于a=a+5；但是前者执行效率要比后者快。 3、 关系运算== 等于、=== 严格等于、 ！= 不等于、 >、 <、 >=、 <=； ===：严格等于，类型不同直接返回false；类型相同，再进行下一步判断。== ：等于，类型不同，尝试将等式两边转为数字，再判断；类型相同，再进行下一步判断。null == undefined √ null=== undefined × 4、条件运算符(多目运算)a>b?true:false有两个关键符号 ？和：当？前面的运算结果为true时，执行：前面的代码当？前面的运算结果为false时。执行：后面的代码>>>夺目运算符可以多层嵌套：例如：var jieguo = num>5?"输入太大"：（num==5"蒙对了"："输入太小"） 5、逻辑运算符&& 与、|| 或、！非、 [运算符的优先级]（） 算最算！ ++ --% / *+ -> < >= <=== !=&&||各种赋值= += *= /= %= js中的分支结构/*[if - else结构]* 1、结构写法：if(判断条件){//条件为true时执行}else{//条件为false时执行}2、if（）中的表达式，运算之后的解果应该为：① Boolean：true 真 false 假② String: 非空字符串为真 空字符串为假③ Number: 0为假，一切非0均为真④ Nan/Null/Undefined： 全为假⑤ Object:全为真3、else{}结构，可以根据具体情况省略*/var num={};if(4){//条件为true时执行document.write("if条件成立");} else{//条件为false时执行document.write("if条件不成立");}/*{多重if、阶梯if}1、结构写法：if（条件一）{//条件一成立} else if（条件二）{//条件一不成立&&条件二成立//else if部分 可以有n多个。}else {条件一不成立&&条件二不成立}2、多重if结构中，各个判断条件是互斥的！只能选择其中一条。 3、if else 的{}可以省略，但一般不提倡；如果省略{}则，if else结构包含的代码，仅为其后最近的一行（分号结束）；如果省略{}则， else 结构永远属于其前方最近的一个if 结构。*/ /*【嵌套if结构】1、结构写法：if （条件一）{//条件一成立if （条件二）{//条件一成立&&条件二成立}else{//条件一成立&&条件二不成立}}else{//条件一不成立}2、if 结构可以多重嵌套，但是原则上不超过三层*/ /*[switch-case 结构：多路分支]* 1、结构写法：* switch(表达式){case 常量表达式1；语句1；break；case 常量表达式2；语句2；break；.....default:语句n;break；2、注意事项;① switch（）中的表达式以及case后面的表达式可以为任何js，对象和数组不行；② case后面的所有常量表达式，必须各不相同，否则只会执行一个；③ case后的常量可以是任何数据类型，同一个switch结构的不同case，可以使不同的数据类型。④ switch在进行判断的时候，采用的是全等判断===；⑤ break的作用：执行完case的代码后，跳出当前switch结构；缺少break的后果；从正确的case项开始，依次执行所有的case和default。原因：⑥⑥ switch结构在判断时，只会判断一次正确答案，当遇到正确的case选项时，将不会再判断后续项目。依次往下执行。⑦ switch结构的执行速率要快于多重if结构。在多路分支时，可以优先考虑使用switch结构。* }*/ [循环结构的步骤]①生明循环变量② 判断循环条件③ 执行循环体(while 中的{}所有代码)操作④ 更新循环变量 然后，循环执行② ③ ④【js 循环条件支持的数据类型】① Boolean：true 真 false 假② String: 非空字符串为真 空字符串为假③ Number: 0为假，一切非0均为真④ Nan/Null/Undefined： 全为假⑤ Object:全为真 while 循环特点：先判断再执行do-while循环特点：先执行，再判断；即使初始条件不成立，do-while循环也至少执行一次。 var n =1;// ①声明循环变量while (n<=10){ //② 判断循环条件document.write("Helloworld"); // ③ 执行循环体(while 中的{}所有代码)操作n++; // ④ 更新循环变量} var m =1;do{document.write("Helloworld<br/>");m++;}while (m<=5); [for循环]1、for循环有三个表达式，分别为：①定义循环变量②判断循环条件③更新循环变量三个表达式之间用分号分割。for循环三个表达式可以省略，两个；缺一不可。2、for循环特点；先判断，再执行。3、for循环三个表达式，均可以又多部分组成，之间用 , 隔开；但是第二部分判断条件需要用&&连接，最终结果需要为真/假。 for (var n=1,j=5;n<=3;j>=1&&n++,j--) {document.write("Hellowfor<br/>");document.write(n+"/"+j);}