Get the property of an object if I have the name of the property as string

5

I have an object of objects. Represents each programming language and its respective color (source: github ):

colors = {
  '1C Enterprise': {
    'color': '#814CCC',
    'url': 'https://github.com/trending?l=1C-Enterprise'
  },
  'ABAP': {
    'color': '#E8274B',
    'url': 'https://github.com/trending?l=ABAP'
  },
  'ActionScript': {
    'color': '#882B0F',
    'url': 'https://github.com/trending?l=ActionScript'
  },
  'Ada': {
    'color': '#02f88c',
    'url': 'https://github.com/trending?l=Ada'
  }
  //...
}

How would you do a function with Javascript which, receiving the name of a language, would return its color. For example devolverColor('Ada') return #02f88c

    
asked by gmarsi 18.01.2018 в 15:40
source

3 answers

4

The function like that would be very simple:

function getColorNotSafe(languaje){
  return colors[languaje].color;
}

BUT is not safe.

Let's see:

Here ALL GOOD

var colors = {
  '1C Enterprise': {
    'color': '#814CCC',
    'url': 'https://github.com/trending?l=1C-Enterprise'
  },
  'ABAP': {
    'color': '#E8274B',
    'url': 'https://github.com/trending?l=ABAP'
  },
  'ActionScript': {
    'color': '#882B0F',
    'url': 'https://github.com/trending?l=ActionScript'
  },
  'Ada': {
    'color': '#02f88c',
    'url': 'https://github.com/trending?l=Ada'
  }
};

console.log(getColorNotSafe("Ada"));

function getColorNotSafe(languaje){
  return colors[languaje].color;
}

Here NOT ALL GOOD

The problem is that this function allows us to pass anything. Who will control that? Suppose you try to find Ada5 :

    var colors = {
      '1C Enterprise': {
        'color': '#814CCC',
        'url': 'https://github.com/trending?l=1C-Enterprise'
      },
      'ABAP': {
        'color': '#E8274B',
        'url': 'https://github.com/trending?l=ABAP'
      },
      'ActionScript': {
        'color': '#882B0F',
        'url': 'https://github.com/trending?l=ActionScript'
      },
      'Ada': {
        'color': '#02f88c',
        'url': 'https://github.com/trending?l=Ada'
      }
    };

    console.log(getColorNotSafe("Ada5"));

    function getColorNotSafe(languaje){
      return colors[languaje].color;
    }

Here BEST

Then, it is convenient to write a safe function, that returns at least null if it does not find the property that is happening to it:

var urlGit='https://github.com/trending?l=';
var colors = {
  '1C Enterprise': {
    'color': '#814CCC',
    'url': urlGit+'1C-Enterprise'
  },
  'ABAP': {
    'color': '#E8274B',
    'url': urlGit+'ABAP'
  },
  'ActionScript': {
    'color': '#882B0F',
    'url': urlGit+'ActionScript'
  },
  'Ada': {
    'color': '#02f88c',
    'url': urlGit+'Ada'
  }
};

console.log(getColor("Ada"));
console.log(getColor("Ada5"));

function getColor(languaje) {
  var resultado=colors.hasOwnProperty(languaje) ? colors[languaje].color : null;
  return resultado;
}

Another plus

Note that an interesting re-game could be made for the url : it would be to combine the received parameter with the variable urlGit ... I have not dared to do so because the values are not normalized in the case of the first option. I put this note to open that possibility, looking to simplify the code, making it less repetitive.

    
answered by 18.01.2018 / 16:41
source
3

I would put:

 var colors = {
        '1C Enterprise': {
          'color': '#814CCC',
          'url': 'https://github.com/trending?l=1C-Enterprise'
        },'ABAP': {
          'color': '#E8274B',
          'url': 'https://github.com/trending?l=ABAP'
        },'ActionScript': {
          'color': '#882B0F',
          'url': 'https://github.com/trending?l=ActionScript'
        },'Ada': {
          'color': '#02f88c',
          'url': 'https://github.com/trending?l=Ada'
        }
       };

 console.log (colors['ActionScript'].color);
 

You can make a function and pass it as a parameter to the language, but like the other example that was sent to you recently, you have to make sure that this language is well written.

    
answered by 18.01.2018 в 15:56
2

Try accessing the properties of an object using access by index objeto[nombrePropiedad] .

Example:

colors = {
  '1C Enterprise': {
    'color': '#814CCC',
    'url': 'https://github.com/trending?l=1C-Enterprise'
  },
  'ABAP': {
    'color': '#E8274B',
    'url': 'https://github.com/trending?l=ABAP'
  },
  'ActionScript': {
    'color': '#882B0F',
    'url': 'https://github.com/trending?l=ActionScript'
  },
  'Ada': {
    'color': '#02f88c',
    'url': 'https://github.com/trending?l=Ada'
  }
};

console.log(colors["Ada"].color);
console.log(colors["1C Enterprise"].color);

Just make sure you send the property name correctly.

You can also define a function that returns the color directly if you need:

colors = {
  '1C Enterprise': {
    'color': '#814CCC',
    'url': 'https://github.com/trending?l=1C-Enterprise'
  },
  'ABAP': {
    'color': '#E8274B',
    'url': 'https://github.com/trending?l=ABAP'
  },
  'ActionScript': {
    'color': '#882B0F',
    'url': 'https://github.com/trending?l=ActionScript'
  },
  'Ada': {
    'color': '#02f88c',
    'url': 'https://github.com/trending?l=Ada'
  }
};

colors.devolverColor = function(lenguaje){
   return (this[lenguaje].color);
}

console.log(colors.devolverColor("Ada"));
    
answered by 18.01.2018 в 15:43