How to create a text string using foreach loop?

Question

Trying to create text string from interface to display into UI , Below code is creating separate file for each interface , How do i creat single file as i have given in the expected.

Also is there way to create UI to display typescript code as a sample instead of using text string ?

main.js

var path = "/filepath"
var data = [
  {
        name: "IParam"
    },
    {
        name: "IError"
    }
]
  function createInterfaces(path, data) {
        var _text = 'import { ';
        $.each(data,function(id,val){
            _text +=  val.name + '}' + 'from ' + path + ';\n\n';

        });
        return _text;
    }

Expected Result should be

"import { IParam, IError} from '/filePath'";

You need to clarify. And it seems very wrong to build a JavaScript import statement as a String with JavaScript. But maybe you can clarify. — ssc-hrep3
– ssc-hrep3, Commented Sep 19, 2019 at 14:51
thats why i asked in second point , is there way to build TS using JS code , goal is to have this code on UI so user can compile and use it online playground , any better approach ? — hussain
– hussain, Commented Sep 19, 2019 at 15:14
@ssc-hrep3 asked another question related to second point stackoverflow.com/questions/58014275/… — hussain
– hussain, Commented Sep 19, 2019 at 15:22

Vandesh · Accepted Answer · 2019-09-19 15:21:50Z

3

You should move the last bit out of your for loop

function createInterfaces(path, data) {
        var _text = 'import { ';
        $.each(data,function(id,val){
            _text +=  val.name;

        });
        _text += '}' + 'from ' + path + ';\n\n'
        return _text;
    }

Another way to do it would be -

function createInterfaces(path, data){
 const imports  = data.map(d => d.name).join(', ');
 return `import { ${imports} } from '${path}';\n\n`;
}

Here's the snippet to check -

var path = "/filepath"
var data = [
  {
        name: "IParam"
    },
    {
        name: "IError"
    }
]

function createInterfaces(path, data){
 const imports  = data.map(d => d.name).join(', ');
 return `import { ${imports} } from '${path}';\n\n`;
}

console.log(createInterfaces(path, data));

edited Sep 19, 2019 at 15:21

answered Sep 19, 2019 at 14:52

Vandesh

6,9642 gold badges31 silver badges38 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

random_user_name Over a year ago

Nice. Shows the improvement OP needs to make to existing code, AND shows an alternate method using map. The only thing that would make this better is to use runnable snippets!

hussain Over a year ago

@Vandesh Thank you thats what i was exactly looking , Any suggestion to make this code compile able once we have all required typescript data , putting all sample code together so user can test like online playground ?

Vandesh Over a year ago

added a snippet

hussain Over a year ago

@Vandesh asked another question to my second point if you can help stackoverflow.com/questions/58014275/…

Mr. Polywhirl · Accepted Answer · 2019-09-19 14:53:15Z

0

You should call Array.prototype.map on the data array and return each name, then join the results.

var path = "/filepath"
var data = [ { name: "IParam" }, { name: "IError" } ]

function createInterfaces(path, data) {
  return "import { " + data.map(d => d.name).join(', ') + " } from '" + path + "';\n\n"
}

console.log(createInterfaces(path, data))

answered Sep 19, 2019 at 14:53

Mr. Polywhirl

49.1k12 gold badges96 silver badges147 bronze badges

Comments

nircraft · Accepted Answer · 2019-09-19 20:02:31Z

0

You can use the array.map to create the string and assign teh result to text variable.

text += `import { ${data.map(a => a.name).toString()} } from '${path}' `

edited Sep 19, 2019 at 20:02

nircraft

8,5085 gold badges33 silver badges46 bronze badges

answered Sep 19, 2019 at 14:57

Raghuraman Kesavan

711 silver badge6 bronze badges

Collectives™ on Stack Overflow

How to create a text string using foreach loop?

3 Answers 3

4 Comments

Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

4 Comments

Comments

Comments

Linked

Related