javascript疑难问题---16、类数组对象转换成数组
一、总结
一句话总结：
1、Array的slice方法，例如：Array.prototype.slice.call(arguments);
2、Array.from()，例如：let arr = Array.from(arguments);3、
3、扩展运算符...，例如：let arr = [...arguments];
4、jquery的$.makeArray()，例如：let arr = $.makeArray(arguments);
1、Array的slice方法将类数组对象转换成数组？
a、let arr = Array.prototype.slice.call(arguments);
b、let arr1 = [].slice.call(arguments);
//1、slice方法 function f1() { console.log(arguments); //console.log(arguments instanceof Array); //console.log(arguments instanceof Object); let arr = Array.prototype.slice.call(arguments); console.log(arr); let arr1 = [].slice.call(arguments); console.log(arr1); } f1(1,32,43,4);
2、Array.from()方法 将类数组对象转换成数组？
let arr = Array.from(arguments);
//2、Array.from() function f1() { console.log(arguments); let arr = Array.from(arguments); console.log(arr); } f1(1,32,43,4);
3、扩展运算符... 将类数组对象转换成数组？
let arr = [...arguments]; 要记得在...arguments外面套一个[]来表示数组，因为...默认是展开元素，而不是得到一个数组
//3、扩展运算符... function f1() { console.log(arguments); let arr = [...arguments]; console.log(arr); } f1(1,32,43,4);
4、jquery的$.makeArray() 将类数组对象转换成数组？
let arr = $.makeArray(arguments);
//4、jquery的$.makeArray() function f1() { console.log(arguments); let arr = $.makeArray(arguments); console.log(arr); } f1(1,32,43,5);
二、类数组对象转换成数组
博客对应课程的视频位置：16、类数组对象转换成数组
https://www.fanrenyi.com/video/4/208
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>类数组对象转换成数组</title> 6 </head> 7 <body> 8 <!-- 9 1、slice 10 最经典的方法，使用Array的slice方法， 11 此方法如果不传参数的话会返回原数组的一个拷贝， 12 因此可以用此方法转换类数组到数组； 13 14 2、Array.from() 15 是ES6中的方法，用于将类数组转换为数组。 16 只要有length属性的对象，都可以应用此方法转换成数组。 17 18 3、扩展运算符... 19 ES6中的扩展运算符...也能将某些数据结构转换成数组， 20 这种数据结构必须有遍历器接口。 21 22 4、jquery的$.makeArray() 23 jQuery的此方法可以将类数组对象转化为真正的数组 24 25 --> 26 <script> 27 //1、slice方法 28 // function f1() { 29 // console.log(arguments); 30 // //console.log(arguments instanceof Array); 31 // //console.log(arguments instanceof Object); 32 // 33 // //console.log([]); 34 // // let arr = Array.prototype.slice.call(arguments); 35 // // console.log(arr); 36 // let arr1 = [].slice.apply(arguments); 37 // console.log(arr1); 38 // } 39 // f1(1,32,43,4); 40 41 //2、Array.from() 42 // function f1() { 43 // console.log(arguments); 44 // 45 // let arr = Array.from(arguments); 46 // console.log(arr); 47 // } 48 // f1(1,32,43,4); 49 50 //3、扩展运算符... 51 // function f1() { 52 // console.log(arguments); 53 // 54 // //1,32,43,4 55 // console.log(...arguments); 56 // let arr = [...arguments]; 57 // console.log(arr); 58 // } 59 // f1(1,32,43,4); 60 61 62 </script> 63 64 <!--<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>--> 65 <!--<script>--> 66 <!-- //4、jquery的$.makeArray()--> 67 <!-- function f1() {--> 68 <!-- console.log(arguments);--> 69 70 <!-- let arr = $.makeArray(arguments);--> 71 <!-- console.log(arr);--> 72 <!-- }--> 73 <!-- f1(1,32,43,5);--> 74 <!--</script>--> 75 </body> 76 </html>