Unlocking JSON Keys Using Dashes

When working with JSON objects, we typically access elements using dot notation. For example,

var obj = {"key": "value"}; var val = obj.key;
. However, what if the key contains hyphens, like in this case:
var obj = {"key-with-hyphens": "value"};
? Do we need to switch to using brackets, like this:
var val = obj['key-with-hyphens'];
?

Answer №1

To retrieve the value, use the following syntax:

let value = obj["key-with-hyphens"];

Answer №2

> let myObj = {"key-with-hyphens": "myValue"};
> myObj["key-with-hyphens"];
< "myValue"

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Issues with the functionality of the submit button (html, js, php)

Seeking assistance with a submit button functionality issue - I have a simple submit button that allows visitors to enter their email address. Upon clicking the button, it should add their email to a CSV file and display a pop-up thank you message. The pr ...

Ensure the video frame stretches to fit the full width

I am struggling to make my video frame fill the entire width of the screen. Even though I have tried using CSS, the video container does not stretch to the full width as expected. https://i.sstatic.net/kxyE0.png How can I ensure that the video plays acro ...

Is it possible to generate an image using data from a JSON file?

Possible Duplicate: Converting array to PNG in PHP Pixel Data in JSON Format { "274:130":"000", "274:129":"000", "274:128":"000", "274:127":"000", "274:126":"000", "274:125":"000", } What is the most efficient method for converting a JSO ...

Having difficulty altering the div color in real-time using VueJS

I'm currently in the process of building an application with Bootstrap and VueJS. My goal is to create a folder structure similar to Google Drive, where I want to make a div stand out in blue once it's selected. Below is the code snippet: ex ...

After successfully creating an account, the displayName consistently appears as null

I have a Vue project that utilizes Firebase as the backend. User registration is done using email and password. Below is the method used in Firebase: firebase.auth() .createUserWithEmailAndPassword(this.user.email, this.user.password) . ...

Tips on utilizing json.tool in the command line to validate and format language files while preserving unicode characters

Ubuntu 16.04 Bash 4.4 python 3.5 After receiving a collection of language files from freelance translators on Upwork, it became evident that none of the files had matching line counts. To address this discrepancy, I decided to validate and format the ...

Error in AngularJS and TypeScript: Property 'module' is undefined and cannot be read

I'm attempting to incorporate TypeScript into my AngularJS 1.x application. Currently, my application utilizes Webpack as a module loader. I configured it to handle the TypeScript compilation by renaming all *.js source files to *.ts, and managed to ...

Tips for leveraging OOP to eliminate redundant code repetition

How can I avoid repeating code when displaying multiple quizzes on the same page? Currently, I have a JavaScript function that duplicates everything for each quiz, with only a few variables changing in the second function. The problem arises when I need t ...

The fixed position element appears to be failing to stay fixed in Google Chrome

Something strange is happening with a fixed position element in Chrome. It is still scrolling with the page even though it should be fixed. To better understand the issue, you can view it on the live site In Firefox and even IE, the "Block 1 Block 2 Block ...

Mastering the art of carousel div creation with Bootstrap

Is there a way to create a carousel in Bootstrap 3 where only one div slides at a time, instead of three? I attempted to use divs instead of images in the traditional carousel structure, but it's not functioning as expected. I'm looking for some ...

Embedding image URLs fetched from JSON data within <li> elements

I have successfully retrieved a JSON response, which is displayed using the code below: Within my HTML document, I have the following structure: <ol id="selectable"></ol> In my JavaScript code, I make use of the following: <script type=" ...

What is the process for verifying a Bootstrap form?

I have created a form using Bootstrap (Form component in ReactJS), but when I attempt to click on the submit button without entering any input, the form is still submitted. How can I implement form validation so that it only submits when all input fields a ...

Is it possible to send variables within an ajax request?

I'm currently in the process of building my own website, and I have a specific requirement where I need to display different queries based on which button is clicked. Can this be achieved using the following code? Here's the HTML snippet: <d ...

Is there a way to update my profile picture without having to constantly refresh the page after uploading it?

Here is the code for my profile page. I am considering using a callback along with another useEffect function, but I'm unsure. Please help me in finding a solution. For now, let's ignore all the code related to deleting, saving, and handling ingr ...

Can someone explain the process of utilizing forEach to add elements to an array using React's useState hook?

I'm attempting to replicate the functionality of the code snippet below in a React environment. Despite several attempts, I have not been able to achieve the same outcome. Old code that worked (non-React) const array = [] res = await getData() res. ...

Executing a child component function once the parent component data is loaded in Angular 5

In my project, I have a parent component called program-page.component where I am invoking a function to fetch some data. ngOnInit() { this.getProgress(); } getFirstProgramItem() { this._contentfulService.getProgramItem(4, 1) .then((programItem) = ...

Using AngularJS and the ng-show directive, you can set a <div> element to

Objective: My aim is to show the content of a div according to the status of checkboxes, while also ensuring that these divs are visible by default If I have this code snippet: <html> <head> <script src="https://ajax.googleapis.com/ajax/li ...

Mastering the art of tab scrolling in VueJS using Bootstrap-vue

Currently, I am working on a VueJS project that utilizes bootstrap-vue. The issue I am facing is that when rendering a list of tabs, it exceeds the width of its parent container. To address this problem, I aim to implement a solution involving a set of but ...

What are the steps to set up ChartJS on a personal computer?

Currently, I am working on creating charts with ChartJS using the CDN version. However, I would like to have it installed directly on my website. After downloading ChartJS v4.1.1, I realized that it only contains typescript files. Since I cannot use TS fil ...

Organize an array of objects in JavaScript into a structure with nested children

I am facing a challenge with organizing an array of objects based on parentId and sort values. I need to create a nested array with 'children' and ensure proper sorting. Consider the following data: [{ id: 1, sort: 2, parentId: null ...