javascript replace() in string

Question

I'm using the Hype api which generates a javascript file. In that javascript file is the following variable.

I need to change all instances of "#A0A0A0" to a different colour. lets say: "#FF0000". I also need to replace all instances of "#2B2B2B" top a different colour. Lets say "#CCCCCC".

var scenes = [{onSceneLoadAction:{type:4,javascriptOid:"6504DC50-C2B8-42D6-9556-7604B01CCCE4-11054-00001758C12D4A4D"},timelines:{kTimelineDefaultIdentifier:{framesPerSecond:30,animations:[],identifier:"kTimelineDefaultIdentifier",name:"Main Timeline",duration:0}},sceneIndex:0,perspective:"600px",oid:"0C38683C-FB04-48C9-B2AA-C359BF30816A-11054-00001051897508E1",initialValues:{"54968410-F25B-4F59-93A6-DBA7A054AEE6-11054-000016DDAE33BD35":{b:86,z:"4",K:"Solid",c:608,bC:-1,L:"Solid",d:15,aS:6,M:1,bD:"none",bB:-1,N:1,aT:6,O:1,g:"#F0F0F0",aU:6,P:1,aV:6,i:"but3",j:"absolute",k:"div",l:"0deg",m:"#2B2B2B",n:"#7B7C7C",aZ:0,A:"#A0A0A0",B:"#A0A0A0",Z:"break-word",r:"inline",C:"#A0A0A0",D:"#A0A0A0",t:13,F:"left",G:"#F2F2F2",aP:"pointer",w:"Button",bA:"#484949",x:"visible",I:"Solid",a:73,y:"preserve",J:"Solid"},"A7459097-CAF4-4E5F-8996-3A8FB91E0AC5-11054-0000186AE9EA70BB":{b:206,z:"9",K:"Solid",c:608,bC:-1,L:"Solid",d:15,aS:6,M:1,bD:"none",bB:-1,N:1,aT:6,O:1,g:"#F0F0F0",aU:6,P:1,aV:6,i:"but7",j:"absolute",k:"div",l:"0deg",m:"#2B2B2B",n:"#7B7C7C",aZ:0,A:"#A0A0A0",B:"#A0A0A0",Z:"break-word",r:"inline",C:"#A0A0A0",D:"#A0A0A0",t:13,F:"left",G:"#F2F2F2",aP:"pointer",w:"Button",bA:"#484949",x:"visible",I:"Solid",a:73,y:"preserve",J:"Solid"},"2D67FF4C-B0ED-42A3-896E-E0B3C105014C-11054-000068248215A681":{G:"#000000",aU:8,c:606,aV:8,r:"inline",d:385,t:14,g:"#F6F6F6",Z:"break-word",i:"text_txt",w:"New Text",j:"absolute",x:"visible",k:"div",y:"preserve",z:"1",aS:8,aT:8,a:73,b:55},"71B60371-D4CF-49BF-91BD-CC44BD204691-11054-00001868C7E4F78F":{b:146,z:"7",K:"Solid",c:608,bC:-1,L:"Solid",d:15,aS:6,M:1,bD:"none",bB:-1,N:1,aT:6,O:1,g:"#F0F0F0",aU:6,P:1,aV:6,i:"but5",j:"absolute",k:"div",l:"0deg",m:"#2B2B2B",n:"#7B7C7C",aZ:0,A:"#A0A0A0",B:"#A0A0A0",Z:"break-word",r:"inline",C:"#A0A0A0",D:"#A0A0A0",t:13,F:"left",G:"#F2F2F2",aP:"pointer",w:"Button",bA:"#484949",x:"visible",I:"Solid",a:73,y:"preserve",J:"Solid"},"9D98FA63-EDF2-48EC-A221-65DCAD6618DA-11054-00001867C6EC1CB4":{b:116,z:"6",K:"Solid",c:608,bC:-1,L:"Solid",d:15,aS:6,M:1,bD:"none",bB:-1,N:1,aT:6,O:1,g:"#F0F0F0",aU:6,P:1,aV:6,i:"but4",j:"absolute",k:"div",l:"0deg",m:"#2B2B2B",n:"#7B7C7C",aZ:0,A:"#A0A0A0",B:"#A0A0A0",Z:"break-word",r:"inline",C:"#A0A0A0",D:"#A0A0A0",t:13,F:"left",G:"#F2F2F2",aP:"pointer",w:"Button",bA:"#484949",x:"visible",I:"Solid",a:73,y:"preserve",J:"Solid"},"8CD4A5EE-2A4D-4D3B-A0A2-198CC4B8A67D-11054-000016DC367A6443":{b:56,z:"3",K:"Solid",c:608,bC:-1,L:"Solid",d:15,aS:6,M:1,bD:"none",bB:-1,N:1,aT:6,O:1,g:"#F0F0F0",aU:6,P:1,aV:6,i:"but2",j:"absolute",k:"div",l:"0deg",m:"#2B2B2B",n:"#7B7C7C",aZ:0,A:"#A0A0A0",B:"#A0A0A0",Z:"break-word",r:"inline",C:"#A0A0A0",D:"#A0A0A0",t:13,F:"left",G:"#F2F2F2",aP:"pointer",w:"Button",bA:"#484949",x:"visible",I:"Solid",a:73,y:"preserve",J:"Solid"},"42F7484E-2372-40FD-AE98-DF55B5D519EE-11054-000016D491A38B6A":{b:26,z:"2",K:"Solid",c:608,bC:-1,L:"Solid",d:15,aS:6,M:1,bD:"none",bB:-1,aT:6,N:1,O:1,g:"#F0F0F0",aU:6,P:1,aV:6,i:"but1",j:"absolute",k:"div",l:"0deg",m:"#2B2B2B",n:"#7B7C7C",aK:8,aZ:0,aL:8,A:"#A0A0A0",B:"#A0A0A0",Z:"break-word",r:"inline",C:"#A0A0A0",D:"#A0A0A0",t:13,F:"left",G:"#F2F2F2",aP:"pointer",w:"Button",bA:"#484949",x:"visible",I:"Solid",a:73,y:"preserve",J:"Solid"},"6B77001D-C8F6-43DB-A2B9-EBEC671B2D2A-11054-0000186EF778B5DC":{b:266,z:"11",K:"Solid",c:608,bC:-1,L:"Solid",d:15,aS:6,M:1,bD:"none",bB:-1,N:1,aT:6,O:1,g:"#F0F0F0",aU:6,P:1,aV:6,i:"but9",j:"absolute",k:"div",l:"0deg",m:"#2B2B2B",n:"#7B7C7C",aZ:0,A:"#A0A0A0",B:"#A0A0A0",Z:"break-word",r:"inline",C:"#A0A0A0",D:"#A0A0A0",t:13,F:"left",G:"#F2F2F2",aP:"pointer",w:"Button",bA:"#484949",x:"visible",I:"Solid",a:73,y:"preserve",J:"Solid"},"FC21729B-56D0-49E5-927E-868875530D85-11054-000018698DD2C13E":{b:176,z:"8",K:"Solid",c:608,bC:-1,L:"Solid",d:15,aS:6,M:1,bD:"none",bB:-1,N:1,aT:6,O:1,g:"#F0F0F0",aU:6,P:1,aV:6,i:"but6",j:"absolute",k:"div",l:"0deg",m:"#2B2B2B",n:"#7B7C7C",aZ:0,A:"#A0A0A0",B:"#A0A0A0",Z:"break-word",r:"inline",C:"#A0A0A0",D:"#A0A0A0",t:13,F:"left",G:"#F2F2F2",aP:"pointer",w:"Button",bA:"#484949",x:"visible",I:"Solid",a:73,y:"preserve",J:"Solid"},"5B8F0D85-511F-4BF9-BF3C-98A889772CAD-11054-0000186D0537B9F2":{b:236,z:"10",K:"Solid",c:608,bC:-1,L:"Solid",d:15,aS:6,M:1,bD:"none",bB:-1,N:1,aT:6,O:1,g:"#F0F0F0",aU:6,P:1,aV:6,i:"but8",j:"absolute",k:"div",l:"0deg",m:"#2B2B2B",n:"#7B7C7C",aZ:0,A:"#A0A0A0",B:"#A0A0A0",Z:"break-word",r:"inline",C:"#A0A0A0",D:"#A0A0A0",t:13,F:"left",G:"#F2F2F2",aP:"pointer",w:"Button",bA:"#484949",x:"visible",I:"Solid",a:73,y:"preserve",J:"Solid"},"AAB01577-35D9-41B7-8988-748C2A907D1B-11054-000016DED468B453":{b:296,z:"5",K:"Solid",c:608,bC:-1,L:"Solid",d:15,aS:6,M:1,bD:"none",bB:-1,aT:6,N:1,O:1,g:"#F0F0F0",aU:6,P:1,aV:6,i:"but10",j:"absolute",aI:8,k:"div",l:"0deg",aJ:8,m:"#2B2B2B",n:"#7B7C7C",aZ:0,A:"#A0A0A0",B:"#A0A0A0",Z:"break-word",r:"inline",C:"#A0A0A0",D:"#A0A0A0",t:13,F:"left",G:"#F2F2F2",aP:"pointer",w:"Button",bA:"#484949",x:"visible",I:"Solid",a:73,y:"preserve",J:"Solid"}},backgroundColor:"#FFFFFF",name:"Untitled Scene"}];

I tried:

scenes = scenes.replace("#A0A0A0", "#FF0000");

but I get an Object [object object] has no method 'replace' error message in chrome inspector

• zzzzBov: That's an array containing objects, not a string.
• Diodeus - James MacFarlane: "scenes" is not a string, it's an array.

Answer 1

You can't use .replace function with array / object: first you have to go upto object property and then replace that value with another one:

for(var val in scenes[0].initialValues){
 for(var newVal in scenes[0].initialValues[val]){
 if(scenes[0].initialValues[val][newVal] == "#A0A0A0"){
 scenes[0].initialValues[val][newVal] = "#FF0000";
 }
 }
}

Answer 2

scenes is an array, so it hasn't this method.

A (not very elegant) solution could be to encode to json your array, replace, then decode it.

Another solution could be to make a deep clone changing the value.

Here's a function doing it :

// returns a copy of the source structure/array
// but replaces all instances of oldValue by newValue
function getCloneWithReplacement(source, oldValue, newValue) {
 if (source===oldValue) {
 return newValue;
 } else if ($.isArray(source)) {
 var clone = [];
 for (var i=0; i<source.length; i++) {
 if (source[i]) clone[i] = getCloneWithReplacement(source[i], oldValue, newValue);
 }
 return clone;
 } else if (typeof(source)=="object") {
 var clone = {};
 for (var prop in source) {
 if (source[prop]) {
 clone[prop] = getCloneWithReplacement(source[prop], oldValue, newValue);
 }
 }
 return clone;
 } else {
 return source;
 }
}

Both solutions could break many things if you have methods defined on objects of the array... Do this only if it's a just received array.

A third solution is to make an in-place replacement using this (non tested) function :

// replaces all instances of oldValue by newValue
function replace(source, oldValue, newValue) {
 if ($.isArray(source)) {
 for (var i=0; i<source.length; i++) {
 replace(source[i], oldValue, newValue);
 }
 } else if (typeof(source)=="object") {
 for (var prop in source) {
 if (source[prop]==oldValue) {
 source[prop]==newValue;
 } else {
 replace(source[prop], oldValue, newValue);
 }
 }
 }
}

Answer 3

Object indeed has no such method. String has.