Bizarre Object notation with JavaScript

While browsing through a Library called WebApp.net, I stumbled upon this interesting piece of code:

var $h = {
    get HEAD() { return 0 },
    get BACK() { return 1 },
    get HOME() { return 2 },
    get LEFT() { return 3 },
    get RIGHT() { return 4 },
    get TITLE() { return 5 }
};
var $d = {
    get L2R() { return +1 },
    get R2L() { return -1 }
};

Having some knowledge of JS, I find this code rather confusing. Chrome interprets it as an Object with properties like $h.HEAD set to certain numbers after the return statement. It also seems to involve getters within $h.

I'm curious to learn more about this. Unlike Chrome, IE fails to interpret this code, so I need to figure out how to create something similar that works in IE.

javascriptgoogle-chromeinternet-explorerjavascript-objects

Answer №1

You have stumbled upon getters.

Utilizing a getter allows you to trigger a function when accessing a property of an object. Additionally, it provides a level of protection for object properties, as the value of a getter cannot be directly altered.

Getters and setters have been supported in Internet Explorer since IE9 as well.

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

Employing distinct techniques for a union-typed variable in TypeScript

I'm currently in the process of converting a JavaScript library to TypeScript. One issue I've encountered is with a variable that can be either a boolean or an array. This variable cannot be separated into two different variables because it&apos ...

javascripttypescript

Updating a validation directive on $watch in AngularJS version 1.2

I created a directive for validation on a multi-select that allows for dynamic length validation of selected items. The directive is used like this: (function() { 'use strict'; angular .module('myModule') .dire ...

javascriptangularjsvalidation

File bootstrap.min.css is currently experiencing compatibility issues

I am currently working on a website where I have two images that are displaying vertically. However, I would like these images to be displayed horizontally with animation. I attempted to use Bootstrap to achieve this horizontal layout, but when I include ...

javascripthtmlcsstwitter-bootstrap

Populate an array using a web API AJAX request in jQuery

I'm encountering an issue with jQuery or Javascript. My goal is to display additional flags in Google maps from an IP array. I've successfully passed the IP array to the function, but when I use ajax to call the web API multiple times correspondi ...

javascriptarraysajaxasp.net-web-api

After adding data to an empty array, index 0 becomes undefined for someEmptyArray

Currently, I am utilizing fs.readdir to generate an array of filenames within a specific directory. Additionally, I have implemented some regex functions to filter out undesirable filenames and/or filetypes. Upon executing the code provided below, I succe ...

javascriptarraysnode.jsundefined

The MongoClient object does not possess the 'open' method

I recently started working on a project using Node.js, Express.js, and MongoDB. I've encountered some issues while trying to set up the database configuration. Below is a snippet of code from my index.js file: var http = require('http'), ...

javascriptnode.jsmongodbexpressdatabase

When a property is passed as a prop in a Vue component, it is received

https://jsfiddle.net/2xwo87bs/ In order for Vue to properly handle the object prop that is being passed to the component, it is necessary to first convert the string into an actual object. While in the provided snippet I have used JSON.parse() as a qui ...

javascriptstringobjectvue.jsvue-component

Activating a function on a click or item selection in React using Office UI Fabric's

<div> <CommandBar areNamesVisible={false} areIconsVisible={true} items={[ { name:"James Towns", className:"noHoverEffect", }, { key:"Info", icon:"Contact", onItemClick={this.handlePanel} ...

javascriptreactjsonclickjsxonitemclick

React - updates to server values do not display in DOM right away

When I work from the client side, I have a modal in my HomeComponent that allows me to select an element. My goal is to then display that selected element within the same HomeComponent (in the productosEnVenta function). The element chosen in the modal is ...

javascriptreactjs

Position the Bootstrip 4 tooltip to automatically display on the right side

In order to customize the placement of my tooltip on desktop, I have opted for having it positioned on the right side of the elements. While this choice aligns well with my design preferences, it has presented a challenge when viewing the page on smaller s ...

javascripthtmljquerybootstrap-4popper.js

Customizing the renderInput of the Material UI DatePicker

Recently I integrated material-ui into my React project with TypeScript. I implemented the following code based on the example provided on the official website. import AdapterDateFns from '@mui/lab/AdapterDateFns'; import DatePicker from '@m ...

javascriptreactjstypescriptmaterial-uidatepicker

changing the vertical position of an element using JavaScript

I'm currently working on a project where I have a canvas that animates upwards when a button is clicked. However, I'm facing an issue with making it go back down after the animation completes. It seems to be getting stuck and not returning to its ...

javascripthtmlhtml5-canvas

Discover Vue3's efficient event handling feature that allows you to easily listen to events from dynamically generated child components

I am dynamically creating a Vue component and need to listen to the event it emits. While I know that you can use @eventName in the markup, my component is being created using createApp. const div = document.createElement('div'); this.$refs.logi ...

javascriptvue.jsvue-componentvuejs3

Troubleshooting a misformatted JSON string that lacks proper double quotes in Java Script

{ DataError: { user_id: [ [Object] ] } } I want to transform this string into JSON structure like below: { "DataError": { "user_id": [ [Object] ] } } Is there a potential method to achieve this outcome from incorrectly formatted JSON string? ...

javascriptjsonmalformed

Refresh selected items after inserting data via ajax in CodeIgniter

I have a select list on my view that allows users to add new items using a plus button. However, when a new item is added, the list does not refresh. I don't want to refresh the entire page with an ajax query. Instead, I am trying to implement a metho ...

javascriptphpjqueryajaxcodeigniter

What are some ways in which I can utilize the Ember Handlebars helper?

Similar Question: Using logical operators in a Handlebars.js {{#if}} statement Below is the code snippet provided: {{#each dataArray}} <li>{{#isTrue idVal1 idVal2}} display some text1 {{else}} display some text2 {{/isTrue}} & ...

javascripthtmlember.jshandlebars.js

The React route fails to display until clicked upon

Struggling with integrating React Router into my Electron desktop app for navigation. During debugging, I realized that the login component, which doesn't use routers, transitions smoothly to a component with a router. However, this new component fail ...

javascriptreactjsreact-routermaterial-ui

Creating files using the constructor in Internet Explorer and Safari

Unfortunately, the File() constructor is not supported in IE and Safari. You can check on CanIUse for more information. I'm wondering if there's a workaround for this limitation in Angular/JavaScript? var file = new File(byteArrays, tempfilenam ...

javascriptangularjs

Using JavaScript to save a file with a data URL in Internet Explorer

Need help with file conversion on different browsers. I developed an app that converts files, and everything was working perfectly in Chrome. However, when it comes to IE (10/11/Edge), I'm facing some challenges: 1) The HTML5 download attribute does ...

javascriptreactjsinternet-explorer

Create a personalized edit button for ContentTools with a unique design

I'm struggling to figure out how to customize the appearance and location of the edit button in ContentTools, a wysiwyg editor. After some research, I learned that I can use editor.start(); and editor.stop(); to trigger page editing. However, I want ...

javascriptphpjquerycontent-management-systemwysiwyg