如何理解這種語法？ var {...} = React;

在反應本土例如： https://github.com/facebook/react-native 如何理解這種語法？ var {...} = React;

var React = require('react-native'); 
var { ScrollView, TouchableHighlight, Text } = React; 

var TouchDemo = React.createClass({ 
    render: function() { 
    return (
     <ScrollView> 
     <TouchableHighlight onPress={() => console.log('pressed')}> 
      <Text>Proper Touch Handling</Text> 
     </TouchableHighlight> 
     </ScrollView> 
    ); 
    }, 
});

這是什麼語法是什麼意思？

var { ScrollView, TouchableHighlight, Text } = React;

我在nodejs console中鍵入它導致語法錯誤。這種特殊的Javascript語法僅適用於React Native嗎？

感謝

來源

2015-04-22 kkpoon

我想這是一個ES6功能，但它可能是JSX特有的ng以及https：//developer.mozilla。org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment –

查看解構賦值[here]（https://www.airpair.com/javascript/posts/using-es6-harmony-with-nodejs#2 -2解構分配）和[這裏]（https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment）。這是語法糖來保存輸入。 – jfriend00

也就是說Destructuring，一個ECMAScript 6 feature。據我所知，它尚未包含在任何版本的node.js或iojs中，但可能有一個命令行標誌可用於啓用它。

來源

2015-04-22 16:48:02 Paulpro

謝謝。它非常方便。自Python以來就像這個功能一樣 – kkpoon

This document描述了React Native支持的JavaScript環境。

ES5

保留字：promise.catch(function() { });

ES6

Arrow功能：<C onPress={() => this.setState({pressed: true})}

蔓延電話：Math.max(...array);

類：class C extends React.Component { render() { return <View />; } }

解構：var {isActive, style} = this.props;

迭代：for (var element of array) { }

計算屬性：var key = 'abc'; var obj = {[key]: 10};

對象Consise方法：var obj = { method() { return 10; } };

對象簡短表示法：var name = 'vjeux'; var obj = { name };

休息PARAMS：function(type, ...args) { }

模板：VAR誰= '世界';無功海峽=`尊敬的$ {誰};`

ES7

對象傳播：var extended = { ...obj, a: 10 };

功能後面的逗號：function f(a, b, c,) { }

來源

2015-05-02 14:21:01 Menway

如何理解這種語法？ var {...} = React;

回答

相關問題