The javascriptfrom () method converts a class array object into a real array.

Source: Internet
Author: User
With the advent of the Class syntax in ES6, we can create a subclass (such as SubArray) for any built-in type (such as Array). These subclasses also inherit the static methods of the parent Class, for example, SubArray. from (). After this method is called, an instance of the SubArray subclass is returned, instead of an Array instance. Array.from()The method can convert an array object or iteratable object to a real array.

From syntax

Array.from(arrayLike[, mapFn[, thisArg]])

From Parameter

Parameters Description
ArrayLike Array objects of classes or iteratable objects to be converted into real arrays.
MapFn Optional parameter. If this parameter is specified, the final generated array is processed by this function and then returned.
ThisArg Optional parameter, runmapFnFunction timethis.

You can useArray.from()Convert the following two objects to an array:

  • Class array object (withlengthAttributes and arbitrary objects of several index attributes)
  • Iteratable object (you can iterate several element objects from it, for exampleMapAndSet)

Array.from()The method has an optional parameter.mapFnSo that you can execute it again on the last generated array.mapMethod. That is to say Array.from(obj, mapFn, thisArg) It is equivalent Array.from(obj).map(mapFn, thisArg),Unless the created is not an available intermediate array. This is a subclass of some arrays.,For example, typed arrays is very important because the value of the intermediate array must be of the appropriate type when map () is called.

from()OflengthThe property is 1.

fromInstance:

// Convert the class Array object (arguments) to an Array (function () {var args = Array. from (arguments); return args;}) (1, 2, 3); // [1, 2, 3] // Set object) convert to Array. from (Set (["foo", window]); // ["foo", window] // Map object can also be var m = new Map ([[1, 2], [2, 4], [4, 8]); Array. from (m); // [[1, 2], [2, 4], [4, 8] // String object is both a class Array and an iteratable object Array. from ("foo"); // ["f", "o", "o"] // use the map function to convert the Array element Array. from ([1, 2, 3], x => x + x); // [2, 4, 6] // generates a numerical sequence Array. from ({length: 5}, (v, k) => k); // [0, 1, 2, 3, 4]

From compatibility Solution

ECMA-262 Sixth Edition Standard addedArray.from. Some implementations may not be included. You can add the following content before the script as an alternative to useArray.fromMethod. The algorithm is implemented according to the specification in the sixth edition of ECMA-262.ObjectAndTypeErrorHas its own value,callback.callCorrespondingFunction.prototype.call. In addition, since Polyfill cannot be used to implement a real iterator, this implementation does not support generic iteratable elements defined in the specification.

// Production steps of ECMA-262, Edition 6, 22.1.2.1// Reference: https://people.mozilla.org/~jorendorff/es6-draft.html#sec-array.fromif (!Array.from) {  Array.from = (function () {    var toStr = Object.prototype.toString;    var isCallable = function (fn) {      return typeof fn === 'function' || toStr.call(fn) === '[object Function]';    };    var toInteger = function (value) {      var number = Number(value);      if (isNaN(number)) { return 0; }      if (number === 0 || !isFinite(number)) { return number; }      return (number > 0 ? 1 : -1) * Math.floor(Math.abs(number));    };    var maxSafeInteger = Math.pow(2, 53) - 1;    var toLength = function (value) {      var len = toInteger(value);      return Math.min(Math.max(len, 0), maxSafeInteger);    };    // The length property of the from method is 1.    return function from(arrayLike/*, mapFn, thisArg */) {      // 1. Let C be the this value.      var C = this;      // 2. Let items be ToObject(arrayLike).      var items = Object(arrayLike);      // 3. ReturnIfAbrupt(items).      if (arrayLike == null) {        throw new TypeError("Array.from requires an array-like object - not null or undefined");      }      // 4. If mapfn is undefined, then let mapping be false.      var mapFn = arguments.length > 1 ? arguments[1] : void undefined;      var T;      if (typeof mapFn !== 'undefined') {        // 5. else              // 5. a If IsCallable(mapfn) is false, throw a TypeError exception.        if (!isCallable(mapFn)) {          throw new TypeError('Array.from: when provided, the second argument must be a function');        }        // 5. b. If thisArg was supplied, let T be thisArg; else let T be undefined.        if (arguments.length > 2) {          T = arguments[2];        }      }      // 10. Let lenValue be Get(items, "length").      // 11. Let len be ToLength(lenValue).      var len = toLength(items.length);      // 13. If IsConstructor(C) is true, then      // 13. a. Let A be the result of calling the [[Construct]] internal method of C with an argument list containing the single item len.      // 14. a. Else, Let A be ArrayCreate(len).      var A = isCallable(C) ? Object(new C(len)) : new Array(len);      // 16. Let k be 0.      var k = 0;      // 17. Repeat, while k < len… (also steps a - h)      var kValue;      while (k < len) {        kValue = items[k];        if (mapFn) {          A[k] = typeof T === 'undefined' ? mapFn(kValue, k) : mapFn.call(T, kValue, k);        } else {          A[k] = kValue;        }        k += 1;      }      // 18. Let putStatus be Put(A, "length", len, true).      A.length = len;      // 20. Return A.      return A;    };  }());}

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.