JS基础

JS基础

一 JS构成

• 1.ECMAScript
• 2.文档对象类型（DOM）
• 3.浏览器对象模型（BOM）

二 JS基础

1.js是从上向下的同步性解释文档。

• （1）上面的代码不能调用下面script中的标签。
• （2）下面的代码可以调用上面的标签。

2.JavaScript引入

• （1）标签内书写：
  超链接默认阻止跳转。
• （2）内部书写：
  在html文件中直接进行代码的书写，。

3.变量污染

如果加载的js中，变量或者函数相同时，就会覆盖，称为变量污染。

三 注释

行注释

ctrl+/  行注释，注释一行的代码。

块状注释

shift+alt+a 块状注释。

• 块状注释可以用来注释一行中的部分内容。
• 块状注释可以用来注释掉一个函数中的大量代码。
• 块状注释对于函数的注释说明在函数部分讲解。

四 方法变量

1.规则

• （1）js语言每行结束时必须使用 ;(半角) 结束。
• （2）js代码大小写必须严格按照规定。
• （3）一般首字母都是小写，除了类。都使用驼峰式命名规则：除了第一个以外，每个单词的首字母大写。

2.方法

• （1）方法一般包括 方法名(参数…) 必须是英文半角
• （2）常用方法：
• console.log() 控制台输出
• document.write() 页面输出
• alert() 提示消息框
• confirm() 确认消息框
• prompt() 输入文本框

3.对象

• （1）js是点语法，表示某个对象的方法和属性。
• （2）对象有两种模式，一种是属性，属性使用=赋值，一种是方法，方法需要使用括号执行
• （3）document.write() write仅属于document的方法，可以给整个文档中添加内容。div0.write(),这种写法就无法实现。
• （4）innerHTML是所有body内(含body)标签的属性，可以给这些标签内局部添加标签。

五 ES5 和 ES6 规范

1.定义

为了可以让所有浏览器都使用js，我们定义了一个标准(ECMAScript)
各大浏览器都必须按照这个标准渲染页面
ES5 IE8时代支持的js标准
2015年正式使用ES6 又称为ES2015

2.ES5之前的规范

• （1）代码遵循从左至右执行。
  a=3; a=“a”;a=b=3;连等先赋值给=号最左边的元素，再逐级向右
  =号左侧是变量名称，=号右侧是值
• （2）不需要定义，随手写，不需要类型(弱类型)

3.ES5规范

• （1）var a = 1; 使用var声明变量。
• （2）不允许直接使用变量赋值。如果不适用var声明，那该变量一定是window的属性。
• （3）而在函数以外的地方使用var声明也是设置了window的属性。
• （4）变量命名规则：

• ① 变量必须驼峰式命名
  

• ② 临时变量必须使用 _ 起头，后面接驼峰式，有时也会在函数  的参数中使用临时变量名。
  

• ③ 变量不可以使用关键词和保留字
  

• ④ 全局的变量名不能与window下的属性和方法同名。
  

4.ES6规范

• （1）let定义变量 （通常使用var定义）
• （2）const 常量 变量是定义后可以变化值的，常量是一旦定义值就不能再改变。
  常量定义时名称必须全部大写，并且使用_区分单词。使用常量目的是不会被别人修改或者变量污染改变。
  如：const EVENT_ID=“changes”;

5.代码提示信息

alert(message?:any):void
message ==> 参数名称。
？ ==> 可以不写值。
:any  ==> 这个参数可以是任意类型。
:void   ==> 无返回值。

六 数据类型

（1）分类：字符类型，数值类型，布尔类型，未定义型，空值，对象类型。
（2）typeof(a) 返回a的类型 

1.字符型 string

所有使用 "" , '' ,``  的都是字符型。

2.数值型 number

（1）var a = 3；
（2）小数叫做浮点数。
（3）e=0xFF(16进制),
    f=065(8进制),
    g=3.1e+5(科学计数法3.1*10^5)。

3.布尔类型 boolean

true 和 false

4.未定义 undefined

var a;
仅定义变量，未定义变量的值。此时变量的值为undefined。
var b = undefined；
console.log(a===b);输出结果为true。
但 a与b值是相同的，但是形态不同。

• var a;用于全局定义，然后根据需要时赋值，初始是没有值的。
• var b=undefined 用于初始值必须是undefined，或者将原有有值的修改为undefined。

5.空值 null

var = null；

• （1）空值是不等于undefined的。
• （2）null清理内存，将所以引用地址标记清空，用于清理内存 垃圾回收 obj = null；
• （3）字符类型，数值类型，布尔类型，未定义型都不需要null清除

6.对象类型 object

var obj = {}; 声明空对象。
obj = null;   设置为空，对象类型也不存在了。
obj = {
    key : value，（关键词 : 值） 
     …… ……
    //注：①对象中不能出现重复的key。
        ②key不需要加双引号。
        ③变量作为key，必须在外层添加[]
}  
获取对象中key的值时有两种方法:
    (1)一种是点语法，点语法使用范畴仅限于key属性固定，并且明确。常量既可以用点语法，也可以用括号语法。
    (2)另一种是中括号语法，如果是固定的key就使用字符串方式来使用，如果不固定直接[变量]，且变量只能用括号语法。

七 数据类型转换

 数据类型转换分为强制转换和隐式转换两种。

1.数值转字符串

var a = 11.11；
（1）var b=String(a); 类型强制转换 
（2）a=a+"";  利用隐式转换方式，没有强制转换，根据运算特征自动转换为字符串，隐式转换
             隐式转换所使用的的转换方法是自动执行String(a);
（3）a = a.toString(16); 转换为指定的进制数。 参数必须是2-36之间，否则报错,转换为指定的进制数。
（4）a = a.toFixed(小数点位数)  转换为字符串，并且保留小数点位数，自动四舍五入。
（5）a.toExponential();  转换为科学计数法类型的字符串
     a.toPrecision();    转换为科学计数法类型的字符串

2.数值转换布尔值

var  a=0;
a=Boolean(a);
规则：
（1）除了0以外所有的数值转换为布尔值都是true
（2）0转换为布尔值是false

3.数值转换为对象

var a=0;
a=Object(a);  数值型对象，存储在堆中

4.字符串转换为数值

var a="3.2"
a=Number(a);  强制转换为数值类型
其他：
（1）a = parseInt(a); 转换为整数
（2) a = parseFloat(a); 转换为浮点数
（3）a = parseInt(a,进制数); 将字符串转换成x进制数。
注：parseFloat 不能转换进制。
    NaN属于数值类型。

5.字符串转为布尔值

var a = "djjf";
a = Boolean(a);
仅空字符串转换为布尔值时，是false，除此之外全部是true。

6.字符串转换为对象

var a = "aaa";
a = Object(a);  转换为字符串对象。
a = a.trim();   清除字符串前后空格。

7.布尔值转换为数值

var b=true;
b=Number(b);
true转换为1，false转换为0。

8.布尔值转换为字符

转换后就是字符串true和false

9.布尔转换为对象

转换后就是布尔值对象

10.任何类型转换为布尔值

var a="";
var b=0;
var c=NaN;
var d=false;
var e=null;
var f=undefined;
以上6种转换布尔值是false，其他都是true。

11.特殊类型转换

• （1）undefined 和 null 转换为字符串 “undefined” , “null”。
• （2）undefined 转换为 数值： NaN。
• （3）null 转换为数值： 0。

八 运算符

1.算术运算符

算术运算符：  + - * /  %(取模运算符)
运算规则：

• （1）如果在 + 运算符前后出现字符串，必须使用字符串首尾相连的方式将内容连接。
• （2）如果运算过程中使用+符号，但没有使用字符串，其他类型都会转换为数值，并且相加。
• （3）所有类型遇到 - * / %都会隐式转换为数值，然后运算。

2.赋值运算符

赋值运算符： += -= *= /= 
a+=1 ==> a=a+1
赋值运算符的优先级最低

3.一元运算符

一元运算符： a++ ++a a-- --a
a++ ==> a=a+1
a++ 和 ++a ：两者都是对a进行+1操作。
区别：
    a++ 先返回a的值，再进行+1操作。
    ++a 先进行+1操作，再返回+1后的a的值。

4.关系运算符

> < <= >= == === != !==
关系运算是返回布尔值的一种运算表达式
== 判断值是否相等 ；  === 判断值和类型是否相等(代码中尽量使用===)
注：
（1）当比较对象为"" , 0 , false 时，优先转换为数值再进行比较。
（2）undefined==null 结果为true，因为两者都不是数据。
（3）NaN != NaN 
    isNaN(变量) 将字符串转换为数值后判断是否是NaN非数值。

5.逻辑运算符

&&  ||  !

• &&
  true && true = (第二个值)
  true && false = (第二个值)
  false && true = (第一个值)
  false && false = (第一个值)
• ||
  true || true = (第一个值)
  true || false = （第一个值）
  false || true = （第二个值）
  false || false = （第二个值）
• !
  取反运算，结果只能是布尔值。

6.位运算

进制
（1）十进制
    0,1,2,3,4,5,6,7,8,9
（2）二进制
    0,1
（3）八进制
    0,1,2,3,4,5,6,7
（4）十六进制
    0,1,2,3,4,5,6,7,8,9,a,b,c,d,e,f
位运算

• （1）& 与运算
  先将所有十进制数转换为二进制，然后将两个二进制数逐位比较，如果两个数都是1，则返回1，其他情况都返回0。
  0 & 0=0；0 & 1=0，1 & 0=0，1 & 1=1
• （2）| 或运算
  0 | 0=0，1 | 0=1，0 | 1=1，1 | 1=1，
  先将所有十进制数转换为二进制，然后将两个二进制数逐位比较，如果两个数都是0，则返回0，其他情况都返回1。
• （3）^ 异或运算
  先将所有十进制数转换为二进制，然后将两个二进制数逐位比较，如果两个数相同，则返回0，如果两个数不同，则返回1。
  0 ^ 0=0，1 ^ 1=0，0 ^ 1=1，1 ^ 0=1，
• （4）~ 位非运算
  将十进制数值 + 1 ，然后取负
  应用：var str =“abcd”;
  if(~str.indexOf(“a”)){}

7.三目运算

表达式1 ？ 表达式2 ：表达式3;
判断表达式1是否为真，如果表达式1为真，执行表达式2，否则执行表达式3.
（1）？ 前面的表达式1的内容会自动隐式转换为布尔值。
（2）三目运算符比赋值运算符优先级高。
（3）当返回的值为布尔值时，不要使用三目运算符。

流程控制语句

一 条件语句

1. if

if(条件){
（1）如果条件语句中条件隐式转换布尔值后为tru，则进入。
（2）在这里，条件不管什么表达式都会因式转换为布尔值。
（3）！在条件语句中大量使用！实现非真进入。

}

2.if else

（1）if(条件1){
}else if(条件2){
}else if(条件3){
}else{
}
这种结构只会执行其中一个条件语句中的执行语句。
（2）
if(条件1){
}
if(条件2){
}
if(条件3){
}
这种结构每个分支都可能会执行，只要满足条件，就会被执行。

3.switch case

switch（表达式）{
case 值1：
    执行语句1；（当表达式绝对等于值1时，执行这里的内容）
    break；
case 值2：
    执行语句2；（当表达式绝对等于值1时，执行这里的内容）
    break；
case 值3：
    执行语句3；（当表达式绝对等于值1时，执行这里的内容）
    break；
default：
    执行语句4；（当以上条件都不满足时，执行这里）
}

二 循环语句

1.while循环

var i = 0;
while(i++<10){
执行语句；
}

while循环实现深度遍历

while(obj.link){
    console.log(obj.value);
    obj=obj.link;
}

循环嵌套

var j=0,i;
while(j++<10){
    while(i++<10){}
}

2.do while循环

先执行，再判断条件是否继续循环。
do{
执行语句；
}while(判断条件);
（1）不管条件是否满足，至少执行一次语句。
（2）while判断语句使用 i++， do while 判断语句使用++i。

3. for循环

for（循环需要变量的初始值；循环执行的条件；变量不断向条件变换）。{}
for(var i =0;i<100;i++){}
（1）循环需要变量的初始值仅需执行一次，并且不一定需要使用var。
（2）循环的条件是一个表达式，隐式转换为布尔值，值为true时进入语句块，根据循环次数判断多少次。
（3）变量不断向条件变化：每次循环完成后执行的语句内容。
可简写为 for(var i=0,sum=0;i++<100;sum+=i);
（4）注意：
①当进行从大到小循环时，条件语句注意使用=号。
②在双重循环时，不要在内层中判断外层变量或者改变外层变量。
③如果使用break，不写跳出label，默认跳出当前循环。
④循环时同步的。
⑤总循环次数不能超过10亿次，循环不能嵌套太多，一般不超过2层。

关于for的死循环

for(;;){}

三 break

break； 跳出
abc：设置锚点
break abc；跳出锚点位置。

四 continue

continue 跳出当前一次循环，然后继续。
在while循环中，i++使用continue时，i++必须写在continue之前。