5.数组转化

目前,Javascript中其他对象转化成数组的方法我只了解到两种:

1. Array.prototype.slice.call();

将dom数组转成数组

  var r = var s = Array.prototype.slice.call(document.querySelectorAll("div"));

将字符串转化成数组

  var r = var s = Array.prototype.slice.call("hello");
//result:["h", "e", "l", "l", "o"]

将带有length且属性名是数字的对象转化成数组

  var s = {
             0:'面包',
             1:'b',
             3:'沙拉' ,
             length:4
          } 
  var s = Array.prototype.slice.call(s);
//result:["面包", "b", empty × 1, "沙拉"]

  var s = {
             0:'面包',
             1:'b',
             "nian":'沙拉' ,
             length:4
          }
  var s = Array.prototype.slice.call(s);
//["面包", "b", empty × 2]

2. Array.from();

  • 1.该方法是Es6中新增方法

  • 2.该方法的定义为Array.from(arrayLike , function fn(){} , thisArg]),注意其中fn是可以在转化过程中对数据进行处理

  • 3.该方法的使用场景

    • a. 部署了Iterator接口的对象(Set,Map,Array)
    • b. like array object(类数组对象),类数组对象必须有length属性,如果没有,转出来的是空数组,常见的类数组有字符串,arguments,, $("selector")
    • c. object({0: 'a',1: 'b',3: 'c',length:4}) ,带有length属性,且其他属性名必须是数字或者能够转成数值的字符,缺少任何一个都会转成[]

将字符串转化成数组

  var r = Array.from("hello")
//result:["h", "e", "l", "l", "o"]

将带有length且属性名是数字的对象转化成数组

  var s = {
             0:'面包',
             1:'b',
             3:'沙拉' ,
             length:4
          } 
  var  r = Array.from(s)
//result:["面包", "b", undefined, "沙拉"]

将Map对象转成数组

  var s = new Map()
  s.set("1","早餐")
  s.set("2","午餐")
  s.set("3","晚餐")
  var  r = Array.from(s)
// result: [["1", "早餐"],["2", "午餐"],["3", "晚餐"]]

将Set对象转化成数组

var s = new Set()
s.add("1").add("2").add("3").add({"0","a"})
var r = Array.from(s)
//result:["1", "2", "3", {…}]

Array.property.slice()和Array.from()的主要区别在后者可以转化Map,Set这类Es6中新增的方法

数组
JSRUN前端笔记, 是针对前端工程师开放的一个笔记分享平台,是前端工程师记录重点、分享经验的一个笔记本。JSRUN前端采用的 MarkDown 语法 (极客专用语法), 这里只属于前端工程师。