万丈高楼平地起，巩固你的基础知识点，js知识点巩固第一步，面试不在难（1）万丈高楼平地起，为了更好的工作我们必须熟记这些

前言

万丈高楼平地起，为了更好的工作我们必须熟记这些知识点。虽然不一定用到，但记还是要记得。这个只是我知识点整理的第一步后面会慢慢更新的，看的好可以点个赞，谢啦!

1.JS

1.1 JS 数据类型

JS基本有5种简单数据类型：Number,String,Bolean,Null,Underfined.引用数据类型：function,Object,Array

判断数据类型的方法

常用的数据类型判断方法有三种typeof,instanceof,Object.prototype.toString.call()下面介绍一下这几种方法。

typeof

    console.log(typeof 2);              //number
    console.log(typeof true)            //bolean;
    console.log(typeof 'str')           //string;
    console.log(typeof underfined)      //underfined;
    console.log(typeof [])              //object;
    console.log(typeof {})              //object;
    console.log(typeof function(){})    //function;
    console.log(typeof null)            //object

优点：能够快速区分基本数据类型缺点：不能区分object array null 都返回object;

insranceof

有点：能够区分Array、Object和function,适合于判断自定义的实例对象缺点：Number、Bolean、String基本数据类型不能判断

console.log(2 instanceof Number);  //false;
console.log(true instanceof Bolean); //false;
console.log('str' instanceof String) //false;
console.log([] instanceof Array);  //true;
console.log(function(){} instanceof Function) //true;
console.log({} instanceof Object);  //true

Object.prototype.toString.call()

优点：精准判断数据类型
缺点：写法繁琐不容易记，封装后使用

var toString = Object.prototype.toString;
console.log(toString.call(2))   //[Object Number];
console.log(toString.call(true))  //[Object Boolean];
console.log(toString.call('str')) //[Object String];
console.log(toString.call([]))    //[Object Array];
console.log(toString.call(function(){})) //[Object Function];
console.log(toString.call({}))  //[Object Object];
console.log(toString.call(underfined));   //[Object underfined];
console.log(toString.call(null)); //[Object Null]

1.2 var,let,const的区别

let 为ES6新增的变量生命的命令，它类似于var,但是有以下不同：

var声明的变量，其作用域为该语句所在的函数内，且存在变量提升现象。
let声明的变量，其作用域为该语句所在的代码块内，不存在变量提升。
const声明的变量不允许修改。

null和undefined区别

Undefined类型只有一个值，即underfined.当变量声明但未被初始化时，变量的默认值即为underfined.

用法：

变量被声明了，但没有赋值时，就等于underfined。
调用函数时，应该提供的参数没有提供，该参数等于underfined。
对象没有赋值的属性，该属性的值为underfined。
函数没有返回值时，默认返回underfined.

Null类型也只有一个值，即null。null用来表示尚未存在的对象，常用来表示函数企图返回一个不存在的对象
用法：

作为函数的参数，表示该函数的参数不是对象。
表示原型链的终点。

1.3 定义函数的方法

1.函数声明

//ES5
function fntName(){};
function (){};//匿名函数
//es6
()=>{}

2.函数表达式

//ES5 
var fntName = function () {};
//ES6
let fntName =()=>{};

3.构造函数

const fntName = new Function()

1.4 原生ajax

//如何创建ajax
XMLHttpRequest对象的工作流程
<!---兼容性写法----!>
var xmlHttp = null;
if(window.XMLHttpRequest){
    //IE7+,FireFox,Chrome,Safari,Opera
    xmlHttp = new XMLHttpRequest();
}else{
    //IE5 IE6
    xmlHttp = new ActiveXObject('Microsoft.XMLHTTP');
}
兼容性处理
事件的触发条件

1.5 js作用域的理解

其实js作用域的内容还是蛮多的，要单独写一篇长文才能讲的清楚。所以这边就简单的总结一下。

js中作用域一般分为全局作用域和局部作用域。一个变量是属于全局作用域还是属于局部作用域主要看的是变量生命的位置。若是在函数内部生命的那么这个变量就是该函数的局部变量。若是在外部生成的那么这个变量就是全局变量。

全局作用域和局部作用域的区别

全局作用域：在任何地方都能访问函数外定义的变量拥有全局作用域不使用var定义的变量拥有全局作用域所有window对象上的属性拥有全局作用域没有声明在任何函数内部的函数拥有全局作用域

局部作用域：只能在函数内部访问使用var在函数内部定义的变量,和使用function在函数内部声明的函数,拥有局部作用域

1.6 闭包的简单理解

简单来说闭包就是在函数里面声明函数，本质上说就是在函数内部和函数外部搭建起一座桥梁，
子函数可以访问父函数中所有的局部变量，但是父函数不能访问子函数的局部变量另一个作用
就是保护变量不受外界环境污染，使其一直存在内存中。但是闭包对内存消耗比较大
不建议经常使用。

1.6 数组去重的几种方法

####（一）利用ES6中的Set 方法去重####

    //Set 是Es6新增的一个对象，允许存储任何类型的（原始值或引用值）的唯一值。
    let arr = [1,0,0,2,8,8,7];
    function removal (arr){
        return [...new Set(arr)]    
    };
    console.log(removal(arr));

(二) 使用for循环加indexOf判断去重

let arr = [1, 5, 6, 0, 7, 3, 0, 5, 9,5,5];
function removal (arr){
    let newArr=[];
    for(var i=0;i<arr.length;i++){
        if(newArr.indexOf(arr[i])===-1){
            newArr.push(arr[i])
        };
    };
    return newArr;
};
console.log(removal(arr));//[1, 5, 6, 0, 7, 3, 9]

(三) 双重for循环去重####

let arr=[1,8,4,23,4,23,432,4,443,2,1,8];
function removal(arr){
    for(var i=0;i<arr.length;i++){
        
        for(var j=i+1,len=arr.length;j<len;j++){
           if(arr[i]===arr[j]){
               arr.splice(j,1);
               j--;
               len--;
           } 
        }
    };
    return arr;
};
console.log(removal(arr));//[1, 8, 4, 23, 432, 443, 2]

1.7 call，apply和bind的区别

在JS中这三者都是为了改变函数中this的指向，下面我将介绍一下这三者的共同点和区别

（一）相似处

都是用来改变函数的this对象的指向
第一个参数都是this要指向的对象
都可以利用后续参数传参

（二）区别

例：

var xiaoW={
    name:"小王"，
    gender:"男"，
    age:"24",
    fnc:function(){
        console.log(`${this.name}${this.gender}今年${this.age}岁`)
    }
}；
var xiaoH={
    name:"小红",
    gender:'男',
    age:"24",
};
xiaoW.fnc();//小王男今年24

如上代码，xiaoW.fnc 执行时打出的时'小王男今年24岁'，但我们小执行xiaoW.fnc这个函数但输出的确实xiaoH这个资料那该怎么做呢？

//对于call:
xiaoW.fnc.call(xiaoH);
//
//对于apply:
xiaoW.fnc.apply(xiaoH);
//
//对于bind来说
xiaoW.fnc.bind(xiaoH)();
//

bind和apply call 的区别

如上所示，在代码书写中很明显的bind的书写形式和apply 和 call 是不一样的。我们写xiaoW.fnc.bind(xiaoH)是不会有任何结果的。因为call 和 apply 是直接对函数进行调用，而bind方法返回的仍然是一个函数，因此后面还要()来进行调用。

call 和 apply 的区别

列

var xiaoW={
    name:"小王"，
    gender:"男"，
    age:"24",
    fnc:function(school,grade){
        console.log(`${this.name}${this.gender}今年${this.age}岁在${school}上${grade}`)
    }
}；
var xiaoH={
    name:"小红",
    gender:'男',
    age:"24",
};

//如上可以看到say方法多了两个参数，我们可以通过call/apply的参数进行传参
//对于call:
xiaoW.fnv.call(xiaoH,"小学"，"六年级")
//对于apply
xiaoW.fnv.apply(xiaoH,["小学"，"六年级"]);
//call后面的参数与say方法中是一一对应的，而apply的第二个参数是一个数组，数组中的元素是和say方法中一一对应的，这就是//两者最大的区别。

//那么bind如何传参呢
//bind有两种传参方法
xiaoW.fnv.bind(xiaoH,"小学"，"六年级")
xiaoW.fnv.bind(xiaoH)("小学"，"六年级")

for...in 和 for...of

for...in for...of会遍历可遍历对象的所有属性 for...in

let arr = [1,2,3,4,5];
arr.name='name';
for(key in arr){
    console.log(key)//0,1,2,3,4,name;
    console.log(arr[key]//1,2,3,4,5,name;
};

从上面可以看出来for...in中遍历的是数组的索引（键名），我们在arr数组中给它加了一个name的属性也会被遍历出来。所以for...一般用于遍历对象，值是它的键值。 for...of

let arr=[1,2,3,4,5];
arr.name=name;
for(let key of arr){
    console.log(key);//1,2,3,4,5
}

从上面可以看出for...of输出的是数组里面的每个值，我们新增的键值对并没有被输出。

总结

for..in循环出的是key值，for..of循环出的是value值。
推荐在循环对象属性的时候，使用for...in,在遍历数组的时候使用for...of
for..of不能循环普通对象，需要通过和object.keys()搭配使用。

万丈高楼平地起，巩固你的基础知识点，js知识点巩固第一步，面试不在难（1）

前言