React Native `new Function ()` не поддерживает синтаксис ES6

Question

CMD:

react-native init Test && react-native run-android

App.js:

export default class App extends Component {
    render() {
            new Function("person", "const { firstname } = person; alert(firstname);")({ firstname: "Test" });
    }
}

Всякий раз, когда новая функция создается и вызывается, приложение выдает следующее сообщение: "SyntaxError: Unexpected token '{'. Expected an identifier name in const declaration"Только происходит на Android.

Любая помощь будет оценена.Спасибо!

---

React Native: v0.55.7

Answer 1

Попробуйте изменить стиль, который вы создаете для этой функции.В React Native часто встречаются функции стрелок, которые должны быть созданы вне вашего метода рендеринга.Обратите внимание, что ваш метод рендеринга будет срабатывать каждый раз, когда меняется ваше состояние.и это было бы пустой тратой ресурсов памяти и ненужного вычислительного времени

import React, { 
  Component 
} from 'react';

import { 
  Text, 
  View, 
  StyleSheet 
} from 'react-native';


export default class App extends Component {      

  //your custom function
  myFunc = (param) => {
    console.log(param)
    return param
  }

  //your render method
  render() {
    const param = "Im a text"

    //you could do this... i would never do that..
    const myFuncInRender = () => { console.log('Im a stupid func')}
    const myStupidFunc2 = new Function("person", "const { firstname } = person; alert(firstname);")({ firstname: "Test" });

    return (
      <View style={styles.container}>
        <Text style={styles.paragraph}>
          {this.myFunc(param)/* HERE is where you call the func*/}
        </Text>
      </View>
    );
  }
} // end from Class

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    backgroundColor: '#ecf0f1',
    padding: 8,
    alignItems:'center',
  },
  paragraph: {
    margin: 24,
    fontSize: 18,
    fontWeight: 'bold',
    textAlign: 'center',
  },
});

Answer 2

Реагирующая нативная документация указывает, что JavaScriptCore обычно используется во время выполнения (V8 во время отладки), но в нем подробно рассматриваются особенности его настройки.Стоит упомянуть, что в iOS используется собственный JavaScriptCore, в то время как другая версия поставляется вместе с приложением для пользователя на Android.

Поскольку Babel используется во время компиляции с реагированиемВстроенный для поддержки функций ES5 / ES6, возможно, среда выполнения настроена на более низкий уровень поддержки.Поэтому, когда вы пытаетесь создать код из строки во время выполнения, вы на самом деле можете работать с интерпретатором JavaScript, который не понимает, например, деструктурирующий синтаксис.

Вы можете попробовать использовать transform Babel ввремя выполнения для передачи вашего кода:

import {transform} from 'babel-core';

export default class App extends Component {
  render() {
    const f = 'const { firstname } = person; alert(firstname);';

    const result = transform(f, {
        presets: ['es2015']
    });

    new Function("person", result.code)({ firstname: "Test" });
  }
}

Answer 3

Можете ли вы создать const с динамическим именем?Если возможно, извините за недостаток знаний по этому вопросу.В сообщении об ошибке говорится, что ожидается имя переменной const.Я надеюсь, что это было полезно.С наилучшими пожеланиями.