需要澄清何时在JavaScript中使用引号，何时不使用引号

Question

I'm new to JavaScript following the courses from codecademy.com. Recently they introduced bracket notation (as opposed to the simpler dot notation). I understand there are advantages because you can reference things that you can't reference using dot notation. However I don't understand why I'm supposed to use quotes in certain circumstances.

For example:

var suitcase = {
    shorts: "purple"
};
if (suitcase.hasOwnProperty("shorts")) {
    console.log(suitcase.shorts);
}

Why does shorts need quotes around it in the line if (suitcase.hasOwnProperty("shorts")) { ? I'm used to quotes designating something as a string. shorts is a property of the suitcase object so I would think it would be referenced without quotes. So far I've been doing well understanding the rules of JavaScript but this wasn't clearly explained so I find myself confused.

Answer 1

All objects' properties' names are just strings. You can always refer to a property by a string name like a["b"] . The one exception is when you use a . . In that case, ab is a property. This is equivalent to a["b"] . In all other cases, use strings to refer to property names.

hasOwnProperty is a normal method. If you had passed in shorts rather than "shorts" , JS would have treated shorts as a variable.

Answer 2

Consider this:

var suitcase = {
    shorts: 'purple',
    shorts: purple
}

yes, it's assigning to 'shorts' twice. But the first line, 'purple' is assigning a STRING whose value is purple to the shorts object key. The second line, is assigning a VARIABLE named purple , which has not yet been defined.

Context is everything in Javascript. There's no need to quote the shorts portion, because the JS interpreter knows you'r defining an object key there. But it's NOT smart enough to decide if purple should be a string representing a color, or a variable whose name happens to be purple . That's why there's quotes - to provide the necessary context.

Ditto for the hasOwnProperty . If shorts isn't quoted, then it's treated as an undefined variable. if it IS quoted, then it's a string.

Answer 3

Your example is the same as:

    suitcase = new Object();  
    suitcase.shorts = 'purple';
    suitcase.hasOwnProperty('shorts');   //returns true  

Always remember that arguments/parameter in javascript not enclosed in qoutes is variable. Not just javascript actually, all languages. Do not confuse yourself with variables.

Javascript expects a variable shorts .

    var shorts = 'shorts';
    suitcase.hasOwnProperty(shorts);   //returns true

https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Object/hasOwnProperty

Answer 4

the hasOwnProperty() function needs the name of the property you want to check for. Therefore it needs to be passed in as a string. If you leave off the quotes then javascript will assume you're passing a variable containing the property name.

Answer 5

Without the quotes javascript is going to interpret shorts as an object and since shorts is undefined you get. The hasOwnProperty function is looking for a property name of type string.

ReferenceError: shorts is not defined

so

suitcase.shorts

returns "purple"

shorts !== suitcase.shorts

shorts is not the same object as suitcase.shorts, in fact it is not even an object until you declare it.

shorts = "brown"

This sets the value of shorts to "brown", but suitcase.shorts is still "purple"

I hope this clears that up.