js基础知识

1.变量提升

在了解为什么变量提升前，先要弄清楚什么是声明，什么是赋值

变量声明与赋值

console.log(a);
var a=6;

上面这行代码，其实是三行代码：

var a;
console.log(a);
a=6;

函数声明与赋值

function chifan(){
  console.log('我要吃米饭')
}
chifan()
function chifan(){
  console.log('我要吃面')
}
chifan()

/*
实际输出：

我要吃面
我要吃面
*/

上面这行代码整体，是一个函数声明语句，其中 function 就是函数声明的关键字

var showName = function() {
    console.log('xiaoli')
}

这行代码虽与之前的代码执行结果一样，都有了一个函数 showName，但真正的执行过程却不同。
这行代码可以分为两行代码：

var showName     // 声明语句   var 是关键字
showName = function() {
    console.log('xiaoli')
}                  // 赋值语句

这就是所谓的js的函数提升，我们使用的是函数声明的方式，所以js会有类似于变量提升的函数提升，与变量提升不同，函数提升不仅仅提升函数声明，而是提升函数整体，具体过程即：

var chifan=function (){
  console.log('我要吃米饭')
}
var chifan=function (){
  console.log('我要吃面')
}
chifan()
chifan()

我们可以看到，函数提升不仅仅把声明做了提升，同时还把赋值跟着声明一起提升到了最前面

再来看下面这个例子

var game=function (){
  console.log('玩英雄联盟')
}
game()
var game=function (){
  console.log('玩CSGO')
}
game()

这里并没有用函数声明的方式，而用的是函数表达式的方式，所以并不存在函数整体提升，仅仅也只是声明提升，具体执行过程如下：

var game
var game
game=function (){
  console.log('玩英雄联盟')
}
game()
game=function (){
  console.log('玩CSGO')
}
game()

所以 输出的结果当然是：

'玩英雄联盟'
'玩CSGO'

特殊情况
看下面这段代码：

console.log(drink)
function drink(){
  console.log('酒')
}
var drink='饮料'

这里我们可以看到drink即是函数声明的函数，又在最后赋值了一次，这样去执行时，如果变量名称跟已经声明的形式参数或函数相同，则变量声明不会干扰已经存在的这类属性，具体编译过程如下：

var drink=function drink(){
  console.log('酒')
};
console.log(drink);
var drink='饮料';

所以 输出的结果当然是：

[function:drink]

let 与 var 的另一个重要的区别，就是 let 声明的变量不会在作用域中被提升

2.typeof和instanceof的使用和区别

2.1 typeof可以判断的是 undefined,boolean,number,string,function;
判断不了 object 和 null
对于null 和 object都返回object

2.2 instanceof 可以判断object 对象的具体类型
A insinstanceof B
A是实例对象，B是构造函数。
如果B函数的显示原型对象，在A的原型链上返回true
console.log(null instanceof Object);//false

    let s1 = [];
    let s2 = {}
    console.log(s1 instanceof Array);//true
    console.log(s1 instanceof Object);//true
    console.log(s2 instanceof Array);//false

3. 字符串方法

（1）indexof("aa",b)//b是搜索起始位置
（2）search("aa")//里面可以写正则
（3）slice(start, end)//截取
（4）substring(start, end)//无法接受负的索引
（5）substr(start, length)//第二个参数规定被提取部分的长度。
（6）replace("a","b") 方法用另一个值替换在字符串中指定的值
只替换首个匹配：
如需替换所有匹配，请使用正则表达式的 g 标志（用于全局搜索）
（7）concat() 连接两个或多个字符串：
（8）trim() 方法删除字符串两端的空白符
（9）split(",") 将字符串转换为数组：用逗号分隔

4.数字方法

（1）toString() 方法
toString() 以字符串返回数值。
（2）toFixed() 方法
toFixed(1)四舍五入返回多少位小数

5.字符串方法

（1）join(" * ") 方法
也可将所有数组元素结合为一个字符串

（2）删除元素
既然 JavaScript 数组属于对象，其中的元素就可以使用 JavaScript delete 运算符来删除：
使用 delete 会在数组留下未定义的空洞。请使用 pop() 或 shift() 取而代之。

（3）splice() 方法可用于向数组添加新项：
fruits.splice(2, 0, "Lemon", "Kiwi");
第一个参数（2）定义了应添加新元素的位置（拼接）。
第二个参数（0）定义应删除多少元素。
其余参数（“Lemon”，“Kiwi”）定义要添加的新元素。
splice() 方法返回一个包含已删除项的数组：

（4）concat()合并（连接）数组
arr1.concat(arr2,arr3)
是浅拷贝

（5）slice() 方法用数组的某个片段切出新数组。

slice() 可接受两个参数，比如 (1, 3)。
该方法会从开始参数选取元素，直到结束参数（不包括）为止。

6.数组迭代

（1）Array.forEach()

（2）Array.filter()
filter() 方法创建一个包含通过测试的数组元素的新数组。
return true/false

（3）Array.map() 返回一个新数组
map() 方法通过对每个数组元素执行函数来创建新数组。
map() 方法不会对没有值的数组元素执行函数。
（4）Array.reduce()

7.this指向（原则是谁调用，就指向谁）

（1）.在 HTML 事件处理程序中，this 指的是接收此事件的 HTML 元素：

（2）一、普通函数调用
普通函数 this 指向window，因为一般情况下普通函数的调用者都是window

（3）二、对象函数调用
对象的方法 this指向的是对象实例

（4）三、构造函数调用
构造函数 this 指向 实例对象 原型对象里面的this 指向的也是实例对象.

（5）四、定时器函数调用与立即执行函数调用

定时器函数 this 指向的也是window
        window.setTimeout(function() {
            console.log('定时器的this:' + this);

        }, 1000);
        // 6. 立即执行函数 this还是指向window
        (function() {
            console.log('立即执行函数的this' + this);
        })();

（6）ES6中箭头函数的调用
箭头函数不绑定this即箭头函数没有自己的this，如果在箭头函数中使用this，this关键字将指向箭头函数中定义位置中的this

（7）call()和apply()与bind()调用

7.1 call()函数 第一个作用可以调用函数 第二个可以改变函数内的this 指向，
但是call ()的主要作用是可以实现继承

<script>
        var o = {
            name: 'andy',
        }
        function fu(a, b) {
            console.log(this);
            console.log(a + b);
        }
        fu.call(o, 1, 2);
        // call 第一个可以调用函数 第二个可以改变函数内的this 指向
        // call 的主要作用可以实现继承
        function Father(uname, age, sex) {
            this.uname = uname;
            this.age = age;
            this.sex = sex;
        }
        function Son(uname, age, sex) {
            Father.call(this, uname, age, sex);
        }
        var son = new Son('刘德华', 18, '男');
        console.log(son);
    </script>

7.2 apply()也是可以调用函数 ，第二个作用也可以改变函数内部的this指向，但是apply()的第二个参数必须是数组(伪数组)

7.3 bind()不会调用原来的函数 ,但是可以改变原来函数内部的this 指向，调用该函数是有返回值的，返回的是原函数改变this之后产生的新函数

8.obj.hasOwnProperty(propertyName)

hasOwnProperty(propertyName)方法 是用来检测属性是否为对象的自有属性，如果是，返回true，否者false; 参数propertyName指要检测的属性名；

9.对象方法

const returnedTarget = Object.assign(target, source);
方法将所有可枚举（Object.propertyIsEnumerable() 返回 true）的自有（Object.hasOwnProperty() 返回 true）属性从一个或多个源对象复制到目标对象，返回修改后的对象。
还可以将数组转化为对象let obj=Object.assign({},array)