8.20 一周学习总结

一、使用JS的三种方式
  1、html标签中直接内嵌JS
       <button onclick="alert('小婊砸!你真点!')">有本事点我呀!!</button>
       不符合W3C内容与行为分离的要求,不提倡使用

  2、html页面中使用<script></script>包裹JS代码
       <script type="text/javascript">


       JS多行注释,中间 * 号可删掉 Ctrl+Shift+/


       JS单行注释 Ctrl+/

       //JS代码
      </script>
      >>><script></script>标签可以放到页面中任何一个位置

   3、引入外部js文件
     <script language="JavaScript" src="js/01.js"></script>

    注意事项:
                 ①<script></script>标签可以嵌入到页面中任意位置;但位置不同会导致JS代码执行顺序不同
                例如:<script></script>放到<body></body>前面,则JS代码会在页面加载之前就执行

     ②引入外部JS代码,<script></script>必须是成对出现的代码,而且标签中不能再有任何的JS代码(有也不会生效)

二、JS中变量

  1、JS中变量声明的写法:

       var num=10;//使用var声明的变量,属于局部变量,只在当前作用域有效
       num=10; //不用var声明的变量,属于全局变量(即使是全局变量,作用范围也仅仅是这一行+这一行往下的范围,
       再往上,超出了它的作用域),在整个JS文件中有效
       var x=8,y,z=10;使用一行语句,同时声明多个变量,这条语句表明,x初值8,y未赋初值,z初值10
 
     声明变量的注意事项
     ①JS中所有变量的声明,均使用var关键字。变量具体是什么类型,取决于赋给变量值的类型。
 
   ②JS中同一个变量,可以在多次不同赋值时,修改变量的数据类型:
      var a=10; //初始声明时,a属于int型
      a = "哈哈哈";//重复赋值时,a被修改为string型
 
  ③变量可以使用var声明,也可不使用var声明
     [区别]:使用var声明为局部变量,不使用var声明为全局变量
 
  ④只用var声明,但是不赋值,结果为undefined(未赋值)
    例如:var a;//a为undefined
   但不赋值也不声明a,直接使用会报错
 
 ⑤同一变量名,可以多次使用 var声明。但后面的var并没有什么用,第二次var声明时,只会被理解为普通的赋值操作。
 
 
  2、变量名的命名要求:
  ①变量名只能有字母数字下划线组成
 ②开头不能是数字
 ③变量名区分大小写 ,大写字母与小写字母为不同变量
   大写字母用来声明常量
 
  3、变量名命名规范:
  ①要符合小驼峰法则(骆驼命名法),第一个单词首字母小写,剩下的每个单词首字母大写,myNameIsHuiRui
 ②匈牙利命名法,所有字母小写,下划线分隔,my_name_is_hui_rui
 
 4、JS中的数据类型
  ①Undefined:未定义。已经使用var声明,但没有赋值的变量,例: var a;
 ②Null:表示空的引用。
 ③Boolean:布尔类型。表示真假,只有两个值:true/false
④Number:数值类型。可以是整数,也可以是小数
⑤String:字符串类型,用 "" 或 '' 包裹的内容,称为字符串
 ⑥Object:对象类型

 面试重点:6种数据类型

 5、[常用的数值函数]
 ①isNaN():判断一个变量或常量是否是NaN(not a num 非数值);
 使用isNaN()判断时,会尝试使用Number()函数进行转换,若能进行转换成数字,则不是NaN,结果为false

 ②Number()函数:将其他类型的数据尝试转为数值型
   字符串类型
  >>>字符串为纯数值字符串,转为对应的数字 "111"->111
 字符串为空字符串, 转为数字0 ""->0
字符串包含其他任意字符时,都不能转为数字 "1a"->NaN
*
Boolean类型: true转为1,false转为0
Null/Undefined:Null->0 Undefined->NaN

③ParseInt():将字符串转换为整数类型
  >>>纯数值字符串,能转。
  "12"->12;"12.9"->12(小数转换时,不进行四舍五入)
 
  >>>空字符串不能转 ""->NaN
 >>>包含其他字符的字符串,会截取第一个非数值字符串前的数字部分 "123a456"->123 "a123456"->NaN
 
 >>>ParseInt()只能转字符串,转其他类型,全是NaN
 
  面试重点:Number()函数与ParseInt()函数的区别:a、Number()函数可以转各种数据类型,
  ParseInt()函数只能转字符串
 b、两者在转字符串时,结果全然不同,见上详解
 
  ④ParseFloat():将字符串转换为数值型
 转换规则与ParseInt()相同,只是如果有小数点,则保留小数点,如果没有,则依然是整数
 "12.5"->12.5 "12"->12
 
 ⑤typrof():检测变量数据类型
 字符串->String 数值->Number true/false->Boolean
未定义->Undefined 对象{}/Null->Object 函数->function

三、JS中常用的输入输出语句

 1、document.write():将()中的内容打印输出到浏览器屏幕上

     使用需注意:除变量、常量外的所有内容,必须放到 "" 中; 变量和常量必须放到 "" 外;
    如果同时有变量和字符串,必须用+连接;
    eg: document.write("左手中的纸牌: "+left+"<br />");

2、alert():使用弹窗输出
     弹窗警告,()中的内容与上述要求相同

     

3、prompt():弹窗输入
    接受两部分布参数: ①输入框上面的提示内容,可选
                                  ②输入框里面的默认信息,可选

    当只写一部分时,表示输入框上面的提示内容
    可以定义变量,接受输入的内容。点击确定按钮,变量将被赋值为输入的内容,点击取消按钮,变量将被赋值为null
    输入内容时,默认接受的数据类型都是字符串

四、算术运算符

  1、算术运算(单目运算符) : + 、 -、 *、 /、 %、 ++ 、 --
       加 减 乘 除 取余 自增运算符 自增运算符

       +: 有两种作用,连接字符串/加法运算符。当 + 两边全为数字时,进行加法运算;
       当 + 两边有任意一边为字符串时,起连接字符串的作用,,连接之后的结果为字符串

      除 + 外,其余符号运算时,会先尝试将左右变量用Number函数转为数字

      / :结果将会保留小数(可以保存16位)

     ++: 自增运算符 ,将变量在原有基础上加1
     --: 自减运算符 ,将变量在原有基础上减1


    a++ 和 ++a的异同:
   ①相同点:无论 a++ 还是 ++a,运算完后结果相同
   ②不同点:
   a++:先用a的值去运算,语句执行完后a再+1
   ++a:先把a的值+1,然后再用加完后的值(a+1)去执行语句
   eg:var a=3,b=a++ +2,c=++a +2;
   alert(a);
   alert(b);
   alert(c);
   结果为:5 5 7


2、赋值运算: = += -= *= /= %=
赋值号

+=: a+=b,相当于 a=a+b;但是,前者运算效率快,推荐使用前者

3、关系运算: ==、 !=、 === !== >、<、>=、<=
严格等于 不严格等于
>>> 关系运算符,运算之后的结果只能是Boolean类型,true/false
>>> 判断一个数字是否处于某个区间,必须用 && 连接
eg:a<10 && a>0 √
10>a>0 ×
>>> ===: 严格等于;不但要求值相同,类型也必须相同,类型不同,结果直接为false;类型相同,再进行下一步判断

==: 等于。类型相同,与===效果一样。类型不同时,会尝试用Number函数将两边转为数字,再进行判断
特例:aNull==false × Null==Undefined √ NaN==NaN ×

4、条件运算符(多目运算): a>b?true:false

有两个重要符号: ? 和 :
? 前面部分 成立,执行: 前面的代码
? 后面部分 成立,执行: 后面的代码

:两边可以为数值, 则整个式子用于赋值 var a= 1<2?1:2;
:两边可以为代码块,将直接执行代码 1<2?alert(1):alert(2);
多目运算符可以直接嵌套 var a=1<2?alert(1):(1>0?4:5);

5、位运算符、 逻辑运算符: &&、 ||、 ! && 和 || 同时存在时,&&的优先级高于||
与 或 非

&& 两边都成立,结果为true
|| 两边有任意一边成立,结果为true
alert(!true);

6、运算符的优先级
() 小括号最高
! ++ -- 单目运算符
* / %
> >= < <=
+ -
== !=
&& && 和 || 同时存在时,&&的优先级高于||
||
= += -= *= /= 最低的是各种赋值

五、if-else 结构1、结构的写法:

 if(条件){
 //条件为 true 时,执行 if 中语句
}

else{
//条件为 false 时,执行 else 中语句
 }

 2、注意事项:
 ①else{} 语句块可以根据情况省略
 ②if 和 else 后的大括号可以省略,但是省略{}后,if 和 else 只能能跟一条语句,所以并不建议省略 {}

3、if 中的判断条件,支持的情况——面试常考
 ①Boolean: true 为真, false 为假
 ②String :空字符串为假,所有非空字符串(空格也算非空字符串)为真
③Number :零为假,一切非零数字为真
④Null/Undefined/NaN :假
⑤Object :全为真


多重 if、阶梯 if 结构
 1、结构写法:
 if(条件1){
//条件1成立执行
 }

else if(条件2){
//条件1不成立且条件2执行
}


else{
 //所有条件都不成立时执行
 }

 2、多重if结构中,各个判断条件是互斥的,选择其中一条执行;遇到正确选项并执行完后,直接跳出结构,不再判断后续分支



嵌套 if 结构
 1、结构写法:
 if(条件1){
 //条件1成立
if(条件2){
 //条件1不成立 && //条件2成立
 }

 else{
 //条件1不成立 && //条件2不成立
}
 }

 else{
//条件1不成立
 }


2、嵌套 if 结构中,如果省略 {},则 else 结构 永远属于离它最近的一个 if 结构

3、嵌套结构可以多层嵌套,但一般不推荐超过三层
     能用多重 if 结构的一般不推荐使用嵌套 if

原文地址:https://www.cnblogs.com/HRurl/p/7402050.html