javascript - Multiple <script> tags each with its own scope -

i need programmatically generate multiple <script> tags, , each 1 same except parameter different. example:

<script>     function foo() { console.log('1'); }     /* lots of complicated code calls foo() */ </script>  <script>     function foo() { console.log('2'); }     /* lots of complicated code calls foo() */ </script> 

in example first script has parameter value of '1' generated code prints '1' console, while second script has parameter value of '2'.

i know question far offend many programmers' sensibilities. it's of course simplified , need way reasons beyond scope of question.

as understand it, these <script> tags share global scope, foo implementations conflict. 1 fix name them separately, e.g. foo1 , foo2. in reality have many such functions , i'm wondering if there's better way.

is there way enclose each <script> tag in own scope foo implementations don't conflict? i'd prefer without separate libraries or preprocessing, etc - native javascript.

i think way want wrap code in self executing function

<script> (function () {     function foo() { console.log('1'); }     /* lots of complicated code calls foo() */ })(); </script>  <script> (function () {     function foo() { console.log('2'); }     /* lots of complicated code calls foo() */ })(); </script> 

if in both instances, should have desired effect. has option of having both fragments in same script tag if option.