2016-10-07 28 views
12

इसके लिए googled करने के बाद की एक सरणी उत्पन्न मैं दो समाधान पाया:ES6 - संख्या

var data = [...Array(10).keys()]; 
 
console.log(data); 
 
    var data1 = Array(8).fill().map((_, i) => i); 
 
console.log(data1);

data1 प्रदर्शित करता है [0, 1, ..., 7] डेटा बस को प्रदर्शित करता है लेकिन [ [ऑब्जेक्ट ऐरे इटरेटर]] मैं वास्तव में संख्याओं को कैसे देख सकता हूं।

मुझे संख्याओं (यूलर प्रोजेक्ट का हिस्सा) पर कुछ पुनरावृत्तियों के लिए इसकी आवश्यकता है।

पहले मैंने पाइथन में बहुत सारी यूलर चुनौतियों का सामना किया था। अब मैंने फैसला किया है कि मैं इसे जेएस कौशल में विकसित करने में मदद करने के लिए जेएस (जितना संभव हो उतना ईएस 6 सिंटैक्स) कर सकता हूं और जितना संभव कर सकता हूं।

Array.from(Array(10).keys()) 

स्पष्ट है कि, Array.from() और Array.keys() आदेश सभी ब्राउज़रों में काम करने में एक ES6 polyfill की आवश्यकता होती है:

+3

अगर मैं 'वर डेटा = चलाने [... सरणी (10) .keys()];' अपने ब्राउज़र (नवीनतम स्थिर क्रोम) में मैं संख्या बाहर सूचीबद्ध देखते हैं। मैं 'ArrayIterator' देखता हूं अगर मैं केवल' ऐरे (10) .keys() 'करता हूं। –

+1

क्या यह कोडपेन के साथ कुछ करना है? http://codepen.io/wasteland/pen/QKQGNo/?editors=1111 – Wasteland

+2

@ वास्टलैंड इसे बेबेल के साथ करना है, जिसका उपयोग उस विशिष्ट कोड पेन –

उत्तर

19

यहाँ एक सरल उपाय है कि codepen में काम करती है।

12

ऐसा लगता है कि समस्या यह है कि कोडपेन आपके कोड को babel es2015-ढीले का उपयोग करके प्रीकंपाइल करता है।

कि मोड में, आपका

[...Array(10).keys()]; 

[].concat(Array(10).keys()); 

हो जाता है और यही कारण है कि आप एक इटरेटर युक्त एक सरणी देखते हैं।

es2015 मोड के साथ

आप

function _toConsumableArray(arr) { 
    if (Array.isArray(arr)) { 
    for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { 
     arr2[i] = arr[i]; 
    } 
    return arr2; 
    } else { 
    return Array.from(arr); 
    } 
} 
[].concat(_toConsumableArray(Array(10).keys())); 

जो के रूप में वांछित कैसा व्यवहार करेंगे मिलेगा।

मोड के बारे में अधिक जानकारी के लिए ②ality - Babel 6: loose mode देखें।

16

व्यावहारिक उदाहरण के माध्यम से Array.from का एक दौरा

Array.from भी एक दूसरा तर्क है जो एक मानचित्रण समारोह के रूप में प्रयोग किया जाता है स्वीकार करता है

let out = Array.from(Array(10), (_,x) => x); 
 
console.log(out); 
 
// [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]

यह पता करने के लिए अच्छा है क्योंकि आपके माध्यम से 0 की तुलना में कभी-कभी अधिक जटिल होते हैं जो सरणी उत्पन्न करना चाहते हैं

const sq = x => x * x; 
 
let out = Array.from(Array(10), (_,x) => sq(x)); 
 
console.log(out); 
 
// [0, 1, 4, 9, 16, 25, 36, 49, 64, 81]

या आप जनरेटर से बाहर सरणियों कर सकते हैं, भी

function* range(start, end, step) { 
 
    while (start < end) { 
 
    yield start; 
 
    start += step; 
 
    } 
 
} 
 

 
let out = Array.from(range(10,20,2)); 
 

 
console.log(out); // [10, 12, 14, 16, 18]

Array.from सिर्फ बड़े पैमाने पर शक्तिशाली है। लोग अभी तक अपनी पूरी क्षमता का एहसास नहीं करते हैं।

const ord = x => x.charCodeAt(0); 
 
const dec2hex = x => `0${x.toString(16)}`.substr(-2); 
 

 
// common noob code 
 
{ 
 
    let input = "hello world"; 
 
    let output = input.split('').map(x => dec2hex(ord(x))); 
 
    
 
    console.log(output); 
 
    // ["68", "65", "6c", "6c", "6f", "20", "77", "6f", "72", "6c", "64"] 
 
} 
 

 
// Array.from 
 
{ 
 
    let input = "hello world"; 
 
    let output = Array.from(input, x => dec2hex(ord(x))); 
 
    
 
    console.log(output); 
 
    // ["68", "65", "6c", "6c", "6f", "20", "77", "6f", "72", "6c", "64"] 
 
}