真伪数组的转化及apply/call/slice方法

此篇文章前半部分都在介绍真伪数组转换的涉及的相关js方法，原理。
想要直接看真伪数组转化的具体方法可以直接看文章的最后一节“总结真伪数组的转换”。
注意：文章内所有的arr均为真数组的命名，obj及res为伪数组的命名。

补充this的含义：

this：谁调用就是谁
例如：

function test() {
    console.log(this);//打印window。this是谁调用就是谁.此时this是window
}
test();

真伪数组的异同：

• 真伪数组共同特点：都是对象，都有length属性,注意排除window（window也是对象，有length属性，但不是数组）。
• 真伪数组不同特点：真数组.toString后，打印的是将数组内的数拼接为字符串，而伪数组.toString后打印[object object]
  (toString：js的方法，将逻辑值转换为字符串

 var arr = [1, 3, 5, 7, 9];//真数组
var likeArr = {0:"1", 1:"edr", 3:"adsf", length:3};//伪数组
console.log(typeof arr);//object
console.log(typeof likeArr );//打印数组类型object
console.log(arr.toString());//真数组会拼接为一个元素返回
console.log(likeArr .toString());//打印[object object] 
console.log(({}).toString.apply(arr));//{}：代表对象；找到对象的toString，将对象toString中的this改为arr  结果为[object Array]

js的apply与call方法

• apply和call方法的作用：
  专门用来修改方法内部的this
• apply和call方法的格式：
  call（对象，参数1，参数2，…）
  apply（对象，[数组]）
• apply和call方法的使用案例
  -1.通过window.test找到test方法
  -2.通过apply方法将找的test内部的this改为自定义的对象obj

function test() {
    console.log(this);//打印obj。this是谁调用就是谁
}
var  obj = {"name":"lnj" };
window.test.apply(obj);//打印 {"name":"lnj" }
window.test.call(obj);//打印 {"name":"lnj" }

• apply和call方法的区别
  以window.sum.apply(obj, [3, 5]);为例
  1.通过window.sum找到sum方法
  2.通过apply(obj)方法将找的sum内部的this改为自定义的对象
  3.将传入数组中的元素依次取出，传递给形参a、b

function sum(a, b) {
   console.log(this);
   console.log(a + b);
}
window.sum.call(obj, 1, 2);//打印 {"name":"lnj" }  3
window.sum.apply(obj, [3, 5]);;//打印 {"name":"lnj" }  8

js的slice方法（截取数组的方法）

• 如果slice方法什么参数都没有传递，会将数组中的元素放到一个新的数组中原样返回，直接返回[1, 3, 5, 7, 9];
• 如果slice方法传递一个参数：从脚标为所传参数的地方开始截取
• 如果slice方法传递两个个参数：从脚标为所传参数1的地方开始截取，到参数2之前停止截取。

var arr2 = [1, 3, 5, 7, 9];
var res1 = arr2.slice();//[1, 3, 5, 7, 9];
var res2 = arr2.slice(2);//从脚标2开始截取，结果为5,7,9
var res3 = arr2.slice(2, 4);//从脚标2开始截取，到脚标4为止，不包括脚标4，结果为5, 7
###

将真数组转换伪数组的一个过程

• push原理：

var arr = [];
arr.push(1);//将1添加到arr数组中
console.log(arr);

• 真数组转换伪数组原理
  1.通过[].push找到数组中的push方法
  2.通过apply(obj)将找到的push方法内部的this修改为自定义的对象obj
  3.将传入数组arr中的元素依次取出，传递给形参

var arr = [1, 3, 5, 7, 9];
var obj = {}
[].push.apply(obj, arr);//将arr中的数字依次取出来push给obj
console.log(obj);//{ 0:1,1:3,2:5,3:7,4:9,length:5 }

伪数组转为真数组

• 伪数组的分类：系统自带的伪数组、自定义的伪数组。
• 系统自带的伪数组：

我是div
我是div
我是div
var res = document.querySelectorAll("div");//找到界面上所有的div，返回的对象res就是系统自带的伪数组。
console.log(res);//系统自带的伪数组

• 自定义的伪数组

 var obj = {0:"lnj", 1:"33", length:2};

• 系统自带的伪数组和自定义的伪数组转换为真数组
  都可以使用 [].push.apply(arr, res);方法来转换，区别在于自定义的伪数组转换为真数组，IE8以下的浏览器不可以

var res = document.querySelectorAll("div");//系统自带的伪数组
var obj = {0:"lnj", 1:"33", length:2};//自定义伪数组
var arr = [];//先定义一个真数组
[].push.apply(arr, res);//系统自带伪数组转换为真数组
[].push.apply(arr, obj);//自定义的伪数组转换为真数组，IE8以下的浏览器不可以（解决办法：IE8以下浏览器使用slice方法，并且不传参数）

• 解决自定义的伪数组转换为真数组，IE8以下的浏览器不可以的问题
  使用[].slice.call(obj)方法

var obj = {0:"lnj", 1:"33", length:2};
var arr3 = [].slice.call(obj);//将内部的this改为自定义的伪数组obj，slice：将this中的每一个元素放到一个新的数组中原样返回 

总结真伪数组的转换

伪数组快速转换为真数组：[].slice.call(obj);
真数组快读转换为伪数组：[].push.apply(obj , arr);