JS基础知识要点总结一

以下知识点会比较分散

1、HTML5新增的<script…/>元素的两个属性

defer：用于指定脚本是否延迟执行。
async：用于指定脚本是否异步执行。
两个属性都能够让脚本异步下载，但区别在于defer下载完后不会立马执行，等文档渲染完毕后再按顺序执行；而async则是下载完后就执行，腳本执行顺序可能不会按照文档中顺序执行。

2、强制类型转换

toString()：将布尔值、数值等转换成字符串。
parseInt()：将字符串、布尔值等转换成整数。
parseFloat()：将字符串、布尔值等转换成浮点数。

3、变量提升

变量提升只是提升变量声明部分，并不会提升变量赋值部分。例如：

var scope = "全局变量";
function test(){
	document.writeln(scope); //页面打印出undefined，因为只提升了变量名
	var scope = "局部变量";
	document.writeln(scope);//页面打印出“局部变量”
}

4、var、let和const

var和let都是用来定义变量的；const是用来定义常量的

（1）var和let的区别
– var定义的变量没有块作用域。
– var定义的全局变量会自动添加全局window对象的属性。
– var定义的变量会提前装载。

let正是为了解决以上问题出现的

（2）const定义常量
const定义的常量只能在定义时指定初始值（且必须指定初始值）。
使用const声明常量后不允许改变常量值。

5、数值类型

js中的数值都已以IEEE 754双精度浮点数格式保存，且完全支持科学计数法表示，科学计数法中E为间隔符号，E不区分大小写。

a = 5E2;
b = 1.23e-3
c = .34e4//当数值只有小数部分，可省略整数部分的0，但小数点不能省

js除了支持十进制，也支持十六进制和八进制。十六进制以0X或0x开头，9以上的数以a~f表示；八进制以0开头，八进制中只能出现0 ~7的数值。
注：八进制并不是所有浏览器都支持

Infinity（正无穷大）和-Infinity（负无穷大）
当数值变量的值超出了其表数范围时，则会产生无穷大。
– Infinity和-Infinity之间进行算数运算时，结果会变成NaN。
– Infinity和-Infinity与其他普通数值进行算数运算时，得到的结果将依然是正/负无穷大。
– Infinity和-Infinity进行比较运算，两个Infinity总是相等的，两个-Infinity也总是相等的。
– js中允许除数为0，若除数和被除数都为0，则结果为NaN；若正数除0，则结果为Infinity；若负数除0，则结果为-Infinity。

NaN
NaN（非数）不会与任何数值变量相等，也就是NaN==NaN返回false。
通过isNaN()函数判断是否为NaN.

var x = 0 / 0;
alert(isNaN(x));//true

– js提供了方法访问这些特殊值，通过Number类访问：

方法	对应的特殊值
Number.MAX_VALUE	数值型变量允许的最大值
Number.MIN_VALUE	数值型变量允许的最小值
Number.POSITIVE_INFINITY	Infinity（正无穷大）
Number.NEGATIVE_INFINITY	-Infinity（负无穷大）
Number.NaN	NaN（非数）

浮点型数
浮点型数必须要注意的是其精度丢失的问题

var a = .333;
var b = a * 5;
alert(b);//理论上为1.6665，而实际上结果为1.6664999999999999

对于浮点数值的比较，尽量不要直接比较，推荐使用差值比较法——判断两个浮点型变量是否相等，通过判断两个浮点型变量的差值，只要差值小于一个足够小的数即可认为相等。

null和undefined
undefined表示没有为变量设置值或者属性不存在
null表示变量是有值的，只是其值为null
null == undefined返回true；null === undefined返回false

6、js常用的转义字符

\b：代表退格
\t：表示一个制表符，即一个Tab空格
\n：换行回车
\v：垂直的制表符
\r：回车
"：双引号
'：单引号
\：反斜杠，即
\OOO：使用八进制数表示的拉丁字母。OOO表示一个3位的八进制整数，范围是000~377
\xHH：使用十六进制数表示的拉丁字母，HH表示一个2位的十六进制整数，范围是00~FF。
\uHHHH：使用十六进制数表示的字符，HHHH表示一个4为的十六进制整数

7、正则表达式

正则表达式本质是一种特殊字符串，这种字符串允许使用“通配符”。js的正则表达式必须放在两条斜线之间，例如/abc/。
一些相关的表格字符查询：
https://www.jb51.net/article/142216.htm
https://www.runoob.com/js/js-regexp.html
还有一些正则表达式常用方法：
test()、exec()、字符串replace()、search()

8、自加、自减运算符

++或 - - 在操作数的左边和在操作数的右边两种计算出的结果是不同的，以自加为例：

//当++在操作数的右边
var a = 5;
var b = a++ + 6;// 
alert(a + "\n" + b); //弹出5和11，因为a先执行算数运算，然后再自加，所以5+6=11

//当++在操作数的左边
var a = 5;
var b = ++a + 6;// 
alert(a + "\n" + b); //弹出6和12，因为a先执行自加，然后再进行算数运算，所以6+6=12

自减效果与自加基本相似，只是将操作数减1.

9、按位非的运算解析

举例：-7的非的结果为6，8的非的结果为9，以下为二进制运算过程：

10、break和continue

break和continue都是中止循环，区别在于continue只是中止本次循环，接着开始下次循环；break是完全终止整个循环，开始执行循环后的代码。

11、apply()和call()

这两种函数调用都可以动态的传入一个函数引用
（1）call()
格式：函数引用.call(调用者，参数1，参数2…) =等同于= 调用者.函数（参数1，参数2，…）
举例：

var each = function (array,fn) {
        for(var index in array){
            //以window为调用者来调用fn函数
            //index、array[index]是传给fn函数的参数
            fn.call(null,index,array[index]);
        }
 }
//调用each函数，第一个参数是数组，第二个参数是函数
each([4,10,3],function (index,ele) {
        document.write("第"+index+"个元素："+ele);
 })

（2）apply()
格式：函数引用.apply(调用者，[参数1，参数2…]) =等同于= 调用者.函数（参数1，参数2，…）
举例：

var myfun = function (a,b) {
        alert('a:' + a + 'b:' + b);
}
myfun.call(window,12,23);//以call方法动态调用函数
myfun.apply(window,[12,23]);//以apply方法动态调用函数
var example = function (num1,num2) {
		//直接用arguments代表调用example函数时传入的所有参数
        myfun.apply(this,arguments);
}
example(20,40);

12、函数提升

在同一个<script…/>元素内，允许先调用函数，在后面定义函数，因为js会将全局函数提升到此<script…/>元素的顶部定义。例如：

alert(add(1,2));//正常执行弹出3
function add(a,b) {
        return a + b;
};

如果定义的是匿名函数并赋给一个变量的话，这种方式依然会函数提升，但提升的只是被赋值的变量，函数本身不会被提升。例如：

alert(add(1,2));//此时这里会报错，add is not a function
var add = function(a,b) {
        return a + b;
};

同理，局部函数与全局函数类似，命名函数定义会被提升到所在函数的顶部，而匿名函数会将定义的变量名提升到所在函数的顶部。

但如果局部函数在定义匿名函数时没有用var来声明，则在该匿名函数所在的函数执行之后，该匿名函数所赋给的变量则会变成全局变量，例如：

function test() {
        add = function(a,b) {
            return a + b;
        };
}
test();//该函数执行之后，add就会变成全局变量

13、变量名和函数名同名

在js中应尽量避免变量名和函数名同名，否则会发生互相覆盖的情形，具体分为两种情况：
（1）定义变量时只使用var定义变量，不分配初始值，则此时函数的优先级更高，函数会覆盖变量。
（2）定义变量时为变量指定了初始值，此时变量的优先级更高，变量会覆盖函数。

function a() {}
var a;//定义变量，不指定初始值
console.log(a);//输出a的函数体
    
var b;//定义变量，不指定初始值
function b() {}
console.log(b);//输出b的函数体
    
var c = 1;//定义变量，指定初始值
function c() {}
console.log(c);//输出1
    
function d() {}
var d = 1;//定义变量，指定初始值
console.log(d);//输出1

14、箭头函数

箭头函数应注意的五点：
（1）箭头函数并不拥有自己的this关键字，箭头函数中的this总是代表包含箭头函数的上下文。
（2）箭头函数并不绑定arguments，因此不能在箭头函数中通过arguments来访问调用箭头函数的参数。箭头函数中的arguments总是引用当前上下文的arguments
（3）若想用箭头函数返回一个对象，则需要在这个对象的花括号外面包一层圆括号，防止程序误认为对象的花括号为执行体的花括号，例如：

var f = () => {name : zhoa};//错误写法
var f = () => ({name : zhoa});//正确写法

（4）箭头函数不允许在形参列表和箭头之间包含换行；允许在箭头与函数执行体之间包含换行。例如：

var f = () 
        => {name : zhoa};//错误写法
    
var f = () => 
        ({name : zhoa});//正确写法

（5）虽然箭头函数所包含的箭头不是运算符，但是当箭头函数与其他运算符在一起时，也可能由于解析顺序导致错误，例如：

var func;
func = func || () => "yy";//错误写法
func = func || (() => "yy");//正确写法

15、数组处理方法.map和.foreach

两个方法在处理数组的时候处理的都是数组的副本，原数组没有被改变。
.map可以有return返回值；.foreach没有返回值

16、函数中的参数传递

（1）基本类型的参数传递
那么哪些是基本类型呢？
数值类型、布尔类型、字符串类型、undefined类型、null类型

基本类型传入函数里的并不是实参本身，而是实参的副本，因此在函数中修改参数值并不会对实参有任何影响。示例：

function change(arg1) {
        arg1 =10;
        document.write("函数执行中arg1的值为：" + "<br/>");
}
var x = 5;
document.write("函数调用之前x的值为：" + x + "<br/>")//输出5
change(x);//输出10
document.write("函数调用之后x的值为：" + x + "<br/>")//输出5

由代码可看出，实参本身的值并没有被改变：

（2）复合类型的参数传递
复合类型有哪些呢？
Object对象、Array数组、Function函数

复合函数的变量本身并未持有对象本身，因此复制的副本也只是变量名，且复制出的副本变量和原变量指向同一个对象，因此如果是通过副本变量去改变对象中的属性值，属性值是会被改变的；但如果直接改变副本变量，那么原变量是不会被改变的。示例：

function changeAge(person) {
        person.age = 10;
        document.write("执行中age" + person.age + "<br/>")
        person = null
}
var person = {age : 5};
document.write("执行前age" + person.age + "<br/>")//输出5
changeAge(person);//输出10
document.write("函数调用之后person的age值为：" + person.age + "<br/>");//输出10
document.write("person对象为：" + person);//输出[object Object]

由代码可见，person.age属性值被改变了，但person没有被改成null，依然是object：

（3）空参数
——若函数定义时包含了一个参数，但在调用时并没有传参，那么js并不会报错，而是将没有传入实参的参数值自动设置为undefined。
——若定义函数时声明了多个形参，调用函数时不强制要求传入匹配的实参，不会又函数重载，js中函数名就是函数的唯一标识。
——若先后定义两个同名的函数，他们的形参列表不相同，这也不是函数重载，这种情况下后面定义的函数会覆盖前面定义的函数。

17、节点添加和删除class名

添加：节点.classList.add(“类名”)；
删除：节点.classList.remove(“类名”)；