Are there specific methods within the Window object for accessing and modifying keys?

Is there an official mechanism to set/get keys on the Window object besides directly assigning values with window.myValue = 'something'? I'm looking for a method similar to:

window.setValue('myKey', 'myValue')
window.getValue('myKey')

My goal is to apply dependency inversion by creating an interface that interacts with the Window object.

interface GetterSetter {
  setValue(key: string, value: any): void
  getValue(key: string): any
}

function addHi(target: GetterSetter) {
  target.setValue('Hi', 'Marco')
}

addHi(window)
javascripttypescriptdom

Answer №1

For those looking for a practical method to assign and retrieve keys, consider utilizing Reflect:

Reflect.set(obj, 'key', 'value');
console.log(Reflect.get(obj, 'key'));

This technique is applicable to any object, not limited to window.

(though using traditional dot notation is perfectly acceptable)

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

Creating the property 'label' on a string may lead to an error, especially on objects

I encountered a perplexing error that is giving me trouble. My objective is to change the value in a text field within a form upon clicking a button. However, I keep encountering this error: Cannot create property label on string for one of the instances. ...

javascriptreactjsstring

The data type 'A | B' cannot be assigned to type 'A & B'

What could be causing the compilation error in this code? type A = { n: number } type B = { s: string } type Thing = { a: A b: B } function update(obj: Thing, path: keyof Thing) { obj[path] = obj[path] } It seems like both sides of the assignment sh ...

typescriptstatic-typingunion-types

Using Ionic 3 to create a list view that includes buttons linked to the items clicked

I need assistance with modifying the button icon in a list layout: <ion-list inset *ngFor="let audio of event.audios; let i = index"> <ion-item> <div class="item-text-center item-text-wrap"> {{audio.fileName}} </div& ...

angularjstypescriptionic-frameworkionic3

Utilizing TypeScript with Vue3 to Pass a Pinia Store as a Prop

My current stack includes Typescript, Pinia, and Vue3. I have a MenuButton component that I want to be able to pass a Pinia store for managing the menu open state and related actions. There are multiple menus in the application, each using the same store f ...

typescriptvue.jsvuejs3pinia

What are the steps to ensure compatibility with relative paths when transitioning from v5 to v6?

In my application, there are scenarios where multiple routes must pass through a component before rendering specifics. Additionally, there are situations where something is displayed for the parent route and then divided for the children. It's crucia ...

javascriptreactjsreact-routerreact-router-dom

When using Reactjs with leaflet-routing-machine, the waypoint is rendered twice

While attempting to use the leaflet-routing-machine library, I encountered a bug. The issue is that the "Waypoints" section is rendering twice. Why is this happening? Can anyone offer assistance? Thank you https://i.sstatic.net/MlkQ2.jpg My code is lis ...

javascriptreactjsreact-leafletleaflet-routing-machine

Displaying a set through an express server cookie for the client to see

New to using Express and encountering issues with sending cookies. Created a basic express app that is supposed to set a cookie in the browser. Here's the server setup: const express = require('express'); const cookieParser = require(' ...

javascriptnode.jsexpresscookiescross-domain

Efficiently managing AJAX requests in PHP

One aspect of my work involves a substantial amount of UI coding that requires sending AJAX requests to the backend PHP. I've been managing this by using: if(isset($_REQUEST["UniquePostName"])){ /* Do Something*/ } if(isset($_REQUEST["AnotherUniqueP ...

javascriptphpajax

Unit testing a React component by using the `renderToString` method

Context My React application is built using the React Starter Kit. In the server.js file, components are rendered using renderToStaticMarkup and then passed to the Html component, which includes it using dangerouslySetInnerHTML as shown here. I am facing ...

javascriptnode.jsunit-testingreactjsmocha.js

Click event being set within a template literal

In my current project, I am faced with a challenge of implementing an onClick event within a template string. Although the button is rendering correctly, for some reason, the console log is not showing up when the button is clicked. Essentially, I am proce ...

javascriptreactjstypescript

Generating Angular2 CLI components with Angular-Meteor integration

Exploring Angular2 CLI and Meteor has been an interesting journey for me. One thing I've noticed is that when I create a component using Angular2 CLI, integrating it into another module is as simple as including it in the declarations array of that mo ...

angularmeteortypescriptangular-cliangular-meteor

Angular: Embed the user's ID into the payload

Is there a way to automatically retrieve the user id of the logged-in user and include it in the payload when they want to update their data without having to manually input their id? MY LOGIN COMPONENT export class LoginComponent { studentForm: For ...

angulartypescriptangular7

transferring information between different views in express.js

I am completely new to the world of express and node, so please be patient with me :D In my index.ejs file, I have a string that I need to pass to my viewActivity.ejs file. This string will be utilized in the JavaScript section of my viewActivity.ejs file ...

javascriptexpress

The text "Hello ${name}" does not get substituted with the name parameter right away in the message string

I'm struggling to get the basic TypeScript feature to work properly. Everywhere I look on the Internet, it says that: var a = "Bob" var message = 'Hello ${a}' should result in a console.log(message) printing "Hello Bob". Howeve ...

angulartypescript

Ways to establish a default search outcome in a search box

Looking to create a search bar with JavaScript and JSON to display default search results for visitors. Currently, the search bar only shows results after text is removed. How can I show predefined search results when the page is loaded? const search = ...

javascripthtmljson

Obtain session data in Node.js/Express without using the request object

When using express-session, the session variable is accessible under req.session. For instance: app.get('/', function(req, res) { req.session.myVar = 1; } But what if I need to access the session of the current request deep within my ap ...

javascriptnode.jsexpresssession

Is it possible to list bash/sh files as dependencies in package.json?

Currently, I have a bash script named publish.sh that I use for publishing modules to npm. Since I am constantly adjusting this script, I find myself needing to update every copy of it in each npm module I manage. Is there a method to include this bash sc ...

javascriptbashnpmsh

Angular: Disabling a button based on an empty datepicker selection

Can anyone help me figure out how to disable a button when the datepicker value is empty? I've tried using ngIf to check if the datepicker is empty and then disable the button, but it's not working. My goal is to make the button unclickable if th ...

javascripthtmlangulartypescript

Initializing an Express app with JSON file loading

My movie-finding application relies on backend API calls to function. As part of the initialization process, I need to load two JSON files: one containing a list of languages for searching (lang.json) and another stored in the config variable that provides ...

javascriptjsonnode.jsexpressbackend

The React development server is experiencing issues on the Apple MacBook Pro M1

Currently, I am using an Apple MacBook Pro M1. When attempting to start the react development server with react-scripts start, it hangs and fails to start the server altogether. I also experimented with a new sample app created through create-react-app cl ...

javascriptreactjsapple-m1react-devtools