how use local scope with eval





.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty{ height:90px;width:728px;box-sizing:border-box;
}







0















I have a module JS where i use React



 import React from 'react'


My component



export default class TaskDetail extends Component {...


I have a a string that represents a code:



str=`props => {
return React.createElement(.....


and I would use this code in a module JS like this:



const MyCustomWidget = eval(str)


so that one it would be equal to write:



const MyCustomWidget = props => {
return React.createElement(.....


I use MyCustomWidget to create a custom element in react-jsonschema-form



the point of my question is:
in my module i have imported React but i have error React is not defined
that is because the result of eval have another scope...
if i write on top of my module:



 window.React = React


it works! but I wouldn't want to use



It is possible use eval and use the scope of my module ? I would like to use my imported React variable in my module without use window.React=React



is possible?










share|improve this question























  • Take a look here, it might help! stackoverflow.com/questions/9781285/…

    – MKougiouris
    Jan 4 at 16:14






  • 3





    Just because something is possible, does not mean you should do it. Find another pattern that does not use eval.

    – Dimitar Christoff
    Jan 4 at 16:16











  • Eval should really be avoided if possible, but this should be possible: stackoverflow.com/a/43306962/3893820

    – dan
    Jan 4 at 16:17











  • Well, theoretically, but I wouldn't recommend it, just use new Function( React, return ${str}` )( React );`. Then React would be passed as a function parameter which would be available for your code internally. I don't know if anything else would go wrong though

    – Icepickle
    Jan 4 at 16:18











  • Can't you create a local variable that is a function that returns the function you want? You can pass arguments to the outer function that can be used when the inner function executes. I really feel like eval is a bad solution here.

    – Greg Burghardt
    Jan 4 at 16:33


















0















I have a module JS where i use React



 import React from 'react'


My component



export default class TaskDetail extends Component {...


I have a a string that represents a code:



str=`props => {
return React.createElement(.....


and I would use this code in a module JS like this:



const MyCustomWidget = eval(str)


so that one it would be equal to write:



const MyCustomWidget = props => {
return React.createElement(.....


I use MyCustomWidget to create a custom element in react-jsonschema-form



the point of my question is:
in my module i have imported React but i have error React is not defined
that is because the result of eval have another scope...
if i write on top of my module:



 window.React = React


it works! but I wouldn't want to use



It is possible use eval and use the scope of my module ? I would like to use my imported React variable in my module without use window.React=React



is possible?










share|improve this question























  • Take a look here, it might help! stackoverflow.com/questions/9781285/…

    – MKougiouris
    Jan 4 at 16:14






  • 3





    Just because something is possible, does not mean you should do it. Find another pattern that does not use eval.

    – Dimitar Christoff
    Jan 4 at 16:16











  • Eval should really be avoided if possible, but this should be possible: stackoverflow.com/a/43306962/3893820

    – dan
    Jan 4 at 16:17











  • Well, theoretically, but I wouldn't recommend it, just use new Function( React, return ${str}` )( React );`. Then React would be passed as a function parameter which would be available for your code internally. I don't know if anything else would go wrong though

    – Icepickle
    Jan 4 at 16:18











  • Can't you create a local variable that is a function that returns the function you want? You can pass arguments to the outer function that can be used when the inner function executes. I really feel like eval is a bad solution here.

    – Greg Burghardt
    Jan 4 at 16:33














0












0








0








I have a module JS where i use React



 import React from 'react'


My component



export default class TaskDetail extends Component {...


I have a a string that represents a code:



str=`props => {
return React.createElement(.....


and I would use this code in a module JS like this:



const MyCustomWidget = eval(str)


so that one it would be equal to write:



const MyCustomWidget = props => {
return React.createElement(.....


I use MyCustomWidget to create a custom element in react-jsonschema-form



the point of my question is:
in my module i have imported React but i have error React is not defined
that is because the result of eval have another scope...
if i write on top of my module:



 window.React = React


it works! but I wouldn't want to use



It is possible use eval and use the scope of my module ? I would like to use my imported React variable in my module without use window.React=React



is possible?










share|improve this question














I have a module JS where i use React



 import React from 'react'


My component



export default class TaskDetail extends Component {...


I have a a string that represents a code:



str=`props => {
return React.createElement(.....


and I would use this code in a module JS like this:



const MyCustomWidget = eval(str)


so that one it would be equal to write:



const MyCustomWidget = props => {
return React.createElement(.....


I use MyCustomWidget to create a custom element in react-jsonschema-form



the point of my question is:
in my module i have imported React but i have error React is not defined
that is because the result of eval have another scope...
if i write on top of my module:



 window.React = React


it works! but I wouldn't want to use



It is possible use eval and use the scope of my module ? I would like to use my imported React variable in my module without use window.React=React



is possible?







javascript reactjs react-redux






share|improve this question













share|improve this question











share|improve this question




share|improve this question










asked Jan 4 at 16:10









AngelottiAngelotti

12611




12611













  • Take a look here, it might help! stackoverflow.com/questions/9781285/…

    – MKougiouris
    Jan 4 at 16:14






  • 3





    Just because something is possible, does not mean you should do it. Find another pattern that does not use eval.

    – Dimitar Christoff
    Jan 4 at 16:16











  • Eval should really be avoided if possible, but this should be possible: stackoverflow.com/a/43306962/3893820

    – dan
    Jan 4 at 16:17











  • Well, theoretically, but I wouldn't recommend it, just use new Function( React, return ${str}` )( React );`. Then React would be passed as a function parameter which would be available for your code internally. I don't know if anything else would go wrong though

    – Icepickle
    Jan 4 at 16:18











  • Can't you create a local variable that is a function that returns the function you want? You can pass arguments to the outer function that can be used when the inner function executes. I really feel like eval is a bad solution here.

    – Greg Burghardt
    Jan 4 at 16:33



















  • Take a look here, it might help! stackoverflow.com/questions/9781285/…

    – MKougiouris
    Jan 4 at 16:14






  • 3





    Just because something is possible, does not mean you should do it. Find another pattern that does not use eval.

    – Dimitar Christoff
    Jan 4 at 16:16











  • Eval should really be avoided if possible, but this should be possible: stackoverflow.com/a/43306962/3893820

    – dan
    Jan 4 at 16:17











  • Well, theoretically, but I wouldn't recommend it, just use new Function( React, return ${str}` )( React );`. Then React would be passed as a function parameter which would be available for your code internally. I don't know if anything else would go wrong though

    – Icepickle
    Jan 4 at 16:18











  • Can't you create a local variable that is a function that returns the function you want? You can pass arguments to the outer function that can be used when the inner function executes. I really feel like eval is a bad solution here.

    – Greg Burghardt
    Jan 4 at 16:33

















Take a look here, it might help! stackoverflow.com/questions/9781285/…

– MKougiouris
Jan 4 at 16:14





Take a look here, it might help! stackoverflow.com/questions/9781285/…

– MKougiouris
Jan 4 at 16:14




3




3





Just because something is possible, does not mean you should do it. Find another pattern that does not use eval.

– Dimitar Christoff
Jan 4 at 16:16





Just because something is possible, does not mean you should do it. Find another pattern that does not use eval.

– Dimitar Christoff
Jan 4 at 16:16













Eval should really be avoided if possible, but this should be possible: stackoverflow.com/a/43306962/3893820

– dan
Jan 4 at 16:17





Eval should really be avoided if possible, but this should be possible: stackoverflow.com/a/43306962/3893820

– dan
Jan 4 at 16:17













Well, theoretically, but I wouldn't recommend it, just use new Function( React, return ${str}` )( React );`. Then React would be passed as a function parameter which would be available for your code internally. I don't know if anything else would go wrong though

– Icepickle
Jan 4 at 16:18





Well, theoretically, but I wouldn't recommend it, just use new Function( React, return ${str}` )( React );`. Then React would be passed as a function parameter which would be available for your code internally. I don't know if anything else would go wrong though

– Icepickle
Jan 4 at 16:18













Can't you create a local variable that is a function that returns the function you want? You can pass arguments to the outer function that can be used when the inner function executes. I really feel like eval is a bad solution here.

– Greg Burghardt
Jan 4 at 16:33





Can't you create a local variable that is a function that returns the function you want? You can pass arguments to the outer function that can be used when the inner function executes. I really feel like eval is a bad solution here.

– Greg Burghardt
Jan 4 at 16:33












1 Answer
1






active

oldest

votes


















0














If you want to experiment with it...



const evalInContext = a =>
// eslint-disable-next-line no-new-func
new Function('require', 'const React = require("react");' + a).bind(
null,
require
);


See how they evaluate and run react code from a live editor in react-styleguidist
https://github.com/styleguidist/react-styleguidist/blob/34f3c83e76/src/client/rsg-components/ReactExample/ReactExample.spec.js



Once again, if you cannot 100% trust what you eval, don't do it.






share|improve this answer
























    Your Answer






    StackExchange.ifUsing("editor", function () {
    StackExchange.using("externalEditor", function () {
    StackExchange.using("snippets", function () {
    StackExchange.snippets.init();
    });
    });
    }, "code-snippets");

    StackExchange.ready(function() {
    var channelOptions = {
    tags: "".split(" "),
    id: "1"
    };
    initTagRenderer("".split(" "), "".split(" "), channelOptions);

    StackExchange.using("externalEditor", function() {
    // Have to fire editor after snippets, if snippets enabled
    if (StackExchange.settings.snippets.snippetsEnabled) {
    StackExchange.using("snippets", function() {
    createEditor();
    });
    }
    else {
    createEditor();
    }
    });

    function createEditor() {
    StackExchange.prepareEditor({
    heartbeatType: 'answer',
    autoActivateHeartbeat: false,
    convertImagesToLinks: true,
    noModals: true,
    showLowRepImageUploadWarning: true,
    reputationToPostImages: 10,
    bindNavPrevention: true,
    postfix: "",
    imageUploader: {
    brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
    contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
    allowUrls: true
    },
    onDemand: true,
    discardSelector: ".discard-answer"
    ,immediatelyShowMarkdownHelp:true
    });


    }
    });














    draft saved

    draft discarded


















    StackExchange.ready(
    function () {
    StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54042493%2fhow-use-local-scope-with-eval%23new-answer', 'question_page');
    }
    );

    Post as a guest















    Required, but never shown

























    1 Answer
    1






    active

    oldest

    votes








    1 Answer
    1






    active

    oldest

    votes









    active

    oldest

    votes






    active

    oldest

    votes









    0














    If you want to experiment with it...



    const evalInContext = a =>
    // eslint-disable-next-line no-new-func
    new Function('require', 'const React = require("react");' + a).bind(
    null,
    require
    );


    See how they evaluate and run react code from a live editor in react-styleguidist
    https://github.com/styleguidist/react-styleguidist/blob/34f3c83e76/src/client/rsg-components/ReactExample/ReactExample.spec.js



    Once again, if you cannot 100% trust what you eval, don't do it.






    share|improve this answer




























      0














      If you want to experiment with it...



      const evalInContext = a =>
      // eslint-disable-next-line no-new-func
      new Function('require', 'const React = require("react");' + a).bind(
      null,
      require
      );


      See how they evaluate and run react code from a live editor in react-styleguidist
      https://github.com/styleguidist/react-styleguidist/blob/34f3c83e76/src/client/rsg-components/ReactExample/ReactExample.spec.js



      Once again, if you cannot 100% trust what you eval, don't do it.






      share|improve this answer


























        0












        0








        0







        If you want to experiment with it...



        const evalInContext = a =>
        // eslint-disable-next-line no-new-func
        new Function('require', 'const React = require("react");' + a).bind(
        null,
        require
        );


        See how they evaluate and run react code from a live editor in react-styleguidist
        https://github.com/styleguidist/react-styleguidist/blob/34f3c83e76/src/client/rsg-components/ReactExample/ReactExample.spec.js



        Once again, if you cannot 100% trust what you eval, don't do it.






        share|improve this answer













        If you want to experiment with it...



        const evalInContext = a =>
        // eslint-disable-next-line no-new-func
        new Function('require', 'const React = require("react");' + a).bind(
        null,
        require
        );


        See how they evaluate and run react code from a live editor in react-styleguidist
        https://github.com/styleguidist/react-styleguidist/blob/34f3c83e76/src/client/rsg-components/ReactExample/ReactExample.spec.js



        Once again, if you cannot 100% trust what you eval, don't do it.







        share|improve this answer












        share|improve this answer



        share|improve this answer










        answered Jan 4 at 16:25









        Dimitar ChristoffDimitar Christoff

        22.4k84362




        22.4k84362
































            draft saved

            draft discarded




















































            Thanks for contributing an answer to Stack Overflow!


            • Please be sure to answer the question. Provide details and share your research!

            But avoid



            • Asking for help, clarification, or responding to other answers.

            • Making statements based on opinion; back them up with references or personal experience.


            To learn more, see our tips on writing great answers.




            draft saved


            draft discarded














            StackExchange.ready(
            function () {
            StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54042493%2fhow-use-local-scope-with-eval%23new-answer', 'question_page');
            }
            );

            Post as a guest















            Required, but never shown





















































            Required, but never shown














            Required, but never shown












            Required, but never shown







            Required, but never shown

































            Required, but never shown














            Required, but never shown












            Required, but never shown







            Required, but never shown







            Popular posts from this blog

            Monofisismo

            Angular Downloading a file using contenturl with Basic Authentication

            Olmecas