Unexpected token { when add object to an array with .map

Question

var $scope={};
var componentsDir="/root/";
var appPrefix="/app/";


var scriptRef=[];
function proDir(scriptName){
    return componentsDir+appPrefix+'-home-components/pro/js/'+scriptName+'.js';
};

var scriptList =[
            {s_name:'jquery',file:"jquery.js"},
            {s_name:'bootstrap',file:"bootstrap.min.js"},
            {s_name:'easing',file:"jquery.easing.min.js"},
            {s_name:'fittext',file:"jquery.fittext.js"},
            {s_name:'wow',file:"wow.min.js"},
            {s_name:'creative', file:"creative.js"},

            /*{bootstrap :"bootstrap.min.js"},
            {easing :"jquery.easing.min.js"},
            {fittext :"jquery.fittext.js"},
            {wow :"wow.min.js"},
            {creative :"creative.js"},*/
        ]



var newscript = scriptList.map(function(scriptItem){
    console.log(scriptItem)
    return {{scriptItem.s_name:'jquery'},{scriptItem.file:proDir(scriptItem.file)}},
});

console.log(newscript)

I try to find a way to loop through a list of script and add extra dir info to each element with .map. But I am getting an error of

Uncaught SyntaxError: Unexpected token {

I try to return each element as a object for the new newscript array

Community · Accepted Answer · 2017-05-23 11:43:51Z

2

{ is not a valid character after { in JSON.

replace this line:

return {{scriptItem.s_name:'jquery'},{scriptItem.file:proDir(scriptItem.file)}}

with this line:

return {"scriptItem.s_name": 'jquery', "scriptItem.file": proDir(scriptItem.file)}

or another variant might be:

return {
    scriptItem: {
        s_name: 'jquery',
        file: proDir(scriptItem.file)
    }
};

Here is the variant you asked for with your comment "I want to access the newscript's location value like this : newscript.jquery":

var newscript = scriptList.map(function(scriptItem) {
    var returnval = {};
    returnval[ scriptItem.s_name ] = scriptItem.file;
    return returnval;
});

I think you are bumping up against this issue:

How can i name object "keys" programmatically in JavaScript?

When in doubt:

http://jsonlint.com/

edited May 23, 2017 at 11:43

CommunityBot

11 silver badge

answered Aug 1, 2015 at 22:44

code_monk

10.2k3 gold badges46 silver badges45 bronze badges

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

4 Comments

ey dee ey em Over a year ago

now there is the error of "Uncaught SyntaxError: Unexpected token ."

code_monk Over a year ago

@Chen i updated the answer to fix that. the problem was that keys with special characters need to be quoted

ey dee ey em Over a year ago

But I want to access the newscript's location value like this : newscript.jquery then I go the dir location. instead, now I have to do newscript[0].file. I did change the return into return { [name] :file}, but still I have to do newscript[0].jquery. I wonder if I could just eliminate the [0] and use some how, 'jquery' as the index? Thanks

code_monk Over a year ago

ah, i now understand what you're after. I updated the answer. Check the last variant. The trick lies in using bracket notation for your javascript objects, which allows you to evaluate statements when setting keys.

Nikos Papageorgiou · Accepted Answer · 2015-08-01 22:50:34Z

0

The map() method creates a new array with the results of calling a provided function on every element in this array.

This means that the scriptItem variable in each map iteration is one of the objects you have in your scriptList array. Map() makes an operation on that variable, and returns a new variable that will be pushed in a new array, that scriptItem will point to.

In your code, you are returning 2 objects, instead of one. But each array element can hold only one object. So, return only one thing.

var newscript = scriptList.map(function(scriptItem){
    console.log(scriptItem)
    return {s_name:'jquery', file:proDir(scriptItem.file)}
});

answered Aug 1, 2015 at 22:50

Nikos Papageorgiou

1008 bronze badges

1 Comment

Nikos Papageorgiou Over a year ago

P.S. Official documentation is your best friend :)

Paweł Głowacz · Accepted Answer · 2015-08-01 23:16:28Z

0

This should do the work for you:

var newscript = scriptList.map(function(scriptItem){
    console.log(scriptItem);
    var name = scriptItem.s_name;
    var file = proDir(scriptItem.file);
    return {s_name: name, file:file}
});

answered Aug 1, 2015 at 23:16

Paweł Głowacz

3,0444 gold badges21 silver badges27 bronze badges

Collectives™ on Stack Overflow

Unexpected token { when add object to an array with .map

3 Answers 3

4 Comments

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

4 Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related