Close Menu
    Explore the coolest frontend learning platform !
    Visit NamasteDev
    Saturday, February 22

    Advanced JavaScript: Objects – 1

    JavaScript 389 Comments2 Mins ReadJasmine JasmineBy

    We all know Javascript objects. An object is nothing more than a container holding key-value pairs.

    However, there’s a lot more to Javascript objects. Let’s go over some key concepts.

    1. Defining properties with expressions

    JS objects can be defined with expressions as property values. These expressions are immediately computed and stored as values.

    Example:

    let obj = {
    num: (1 + 2) * 3
}

    In this case, the value of num is stored as 9 after the expression is evaluated.

    let obj = {
    num: 9
}

    But what if you want to define a property with a lazily computed expression?

    The only way to achieve that is by wrapping the expression in a function.

    function calc() {
    return (1 + 2) * 3;
}

let obj = {
    num: calc
}

    Now, obj.num holds a reference to the function calc. The value will only be computed by calling obj.num() when necessary.

    2. Types of property names

    Property names can be of any type but automatically converted to strings.

    let obj = {
    "12": "this is a string name",          // string, both obj[12] and obj["12"] will work
    14: "this is an integer name",          // coerced to a string, both obj[14] and obj["14"] will work
    true: "this is a boolean prop name",    // coerced to a string, both obj[true] and obj["true"] will work
    [newObj]: "this is an obj prop name"    // coerced to a string, obj[newObj] will not work but obj["newObj"]

    3. Concise object methods

    Starting from ES6, Javascript allows concise object method definitions without needing the “function” keyword.

    let obj = {
    hello(){
      console.log("Hello");
    }
}

    In this example, the object has a method called “hello” which can be called by obj.hello().

    We will see more in the upcoming episodes.

    Keep Reading

    View 389 Comments

    389 Comments

    3. 貼街招 on

      Hello there, just became aware of your blog through Google, and found that it is truly informative. I am going to watch out for brussels. I’ll be grateful if you continue this in future. Many people will be benefited from your writing. Cheers!

      Reply
    15. Dich vu SMM on

      I don’t even know how I finished up right here, but I believed this post wasonce good. I do not recognise who you might be however definitelyyou’re going to a famous blogger if you happen to aren’t already.Cheers!

      Reply
    19. adult content on

      I do not even know how I ended up here, but I thought this post was great.I do not know who you are but definitely you are going to a famousblogger if you aren’t already 😉 Cheers!

      Reply
    23. Renay on

      You could definitely see your expertise in the article you write.The sector hopes for even more passionate writers like you who aren’t afraid to mention how they believe.Always follow your heart.

      Reply
    135. 印傳單 on

      Hey! Would you mind if I share your blog with my zynga group?There’s a lot of people that I think would really appreciate your content.Please let me know. Thanks

      Reply
    253. SpookySwap on

      SpookySwap is a next-generation decentralized exchange (DEX) built on the lightning-fast Fantom Opera blockchain. Designed for efficiency, security, and low-cost transactions, SpookySwap empowers users to trade, stake, and earn without relying on centralized intermediaries. Its seamless user experience and robust features make it a key player in the expanding world of decentralized finance (DeFi).

      Reply
    Leave A Reply

    Demo

    Courses

    Community

    Contact Us