Can the value of a key automatically default to the parent's value if it is not found in the child?

When looking at the JSON example provided, is there a method to automatically switch back to the parent object key if the child object does not contain the key?

// Example of i18n JSON

    "parent": {
      "foo": "foo",
      "bar": "bar",
      "child": {
        "foo": "baz"
      }
    }

Is there a way (or feature) that allows for seamless fallback to the parent value for the same key?

// Intended usage

$t('parent.child.foo'); // should return "baz"
$t('parent.child.bar'); // should return "bar"

Answer №1

If you're looking for a way to handle null or undefined values in JavaScript, consider using the Nullish coalescing operator (??).

const parent = {
    "foo": "foo",
    "bar": "bar",
    "child": {
        "foo": "baz"
    }
};

console.log(parent.child.bar ?? parent.bar)

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

The window.Print() function is currently experiencing a glitch in Microsoft Edge (Version 91.0.864.59) when trying to use it for the first time within an Angular 12

If you encounter the issue, please follow these steps using the latest version 91.0.864.59 of the Edge browser: https://stackblitz.com/edit/angular-ivy-zbvzap?file=src/app/app.component.html Click on the print button. Close the print dialog. Click on the ...

Three.js tutorial: Rotating items on each axis individually

Looking to create an interactive 3D item that users can rotate with their mouse freely? I experimented with using three quaternions, one for each axis, and then multiplying them together to determine the final position of the item. // Initializing xQuat, y ...

The administrator user assigns a user value in the authentication context, but that value remains hidden from the component where it was originally set

The authentication feature: import React, { useState } from 'react'; let selectedUserByAdmin = ''; const AuthContext = React.createContext({ setSelectedUserByAdmin: () => {}, selectedUserByAdmin, }); export const AuthContextPro ...

Exploring the application of Nested Maps in extracting parameters for the getStaticPaths

Your data structure is organized like this: data = { "cse": { "first": [ "Computer Hardware Essentials", "Computer System Essentials", "Cultural Education" ], "second&qu ...

What is the best way to reorganize the switch case in order to invoke methods from a class?

I have a special character called Hero within my game, this Hero inherits characteristics from the Player class and can perform a variety of actions. The majority of these actions are customized to suit the Hero's abilities. class Hero extends Player ...

Generating an instance of an enum using a string in Typescript

Having trouble accessing the enum members of a numeric enum in TypeScript using window[name]. The result is an undefined object. export enum MyEnum { MemberOne = 0, MemberTwo = 1 } export class ObjectUtils { public static GetEnumMembers(name ...

Experiencing browser crashes following the incorporation of asynchronous functions into a JavaScript file. Seeking solutions to resolve this

In my recent project, I developed a basic online store application using vanilla javascript and ES6 classes. The shop items are stored in a JSON file which I used to populate the user interface. To implement functions like "addToCart", "quantityChange", a ...

Problem with updating the input value in the array

My attempt to replace the input value when deleting a row is not functioning as expected in this dynamic example. <script src="./edit_files/prototype.js" type="text/javascript"></script> <script src="./edit_files/application.js" type="text/ ...

Calculate how frequently an element showcases a particular style

I attempted to tally the occurrences of a specific class on an element, but I keep encountering the error message: $(...)[c].css is not a function Does jQuery have it out for me? Below is the code snippet in question: // hide headings of empty lists le ...

Attempting to modify the background hue of a grid component when a click event is triggered

I am struggling with the syntax to change the color of an element in my grid when clicked. I have attempted different variations without success. Being new to JavaScript, I would appreciate some gentle guidance if the solution is obvious. JS const gri ...

Pass information from ColdFusion to jQuery

I'm attempting to achieve a similar result as this, but I believe the syntax is not quite right: <cfset details = '{ name: "name", address:"address"}' /> <img data-details='#details#' onClick="DisplayDetails()" /> &l ...

Scrolling with React Event

I am attempting to create a scrollbar that only appears when I scroll within a particular area using React. I am utilizing debounce and useState in my implementation. The issue: When I reach the end of the scroll, the event continues to repeat indefinitel ...

Accordion not appearing on the webpage

I'm currently working on implementing a helpful feature at the bottom of my webpage to assist users with navigation. I was thinking of using an accordion as a dropdown helper, but I've been facing some challenges getting it to function properly. ...

Changing the tooltip background color in FullCalendar 6 and Bootstrap 5: A step-by-step guide

My FullCalendar agenda displays events with colored backgrounds. However, I want the tooltips for these events to have matching background colors as well. Currently, the tooltips always show up with a black background. Is there a way to dynamically change ...

`Is it possible to retrieve Wikipedia information directly from a Wikipedia link?`

Is there a way to create a feature where users can input a Wikipedia page link and retrieve all the text from that page? I am working on adding a functionality to my website where users can paste a link to a Wikipedia page they want to analyze into an inp ...

Displaying the total count of slides available on the webpage

Check out the custom slider I created on this codepen page: http://codepen.io/anon/pen/NqQpjG I have added an additional feature that tracks the total number of slides that have been moved. For instance, if there are a total of 8 slides, the initial va ...

Node(Meteor) experiencing a memory leak due to setTimeout

I have encountered an unusual memory leak associated with the use of setTimeout. Every 15 seconds, I execute the following code using an async function that returns an array of promises (Promise.all). The code is supposed to run again 15 seconds after all ...

The task "default" is not found within your current gulpfile configuration

After running gulp in my console, I encountered the following error: Task 'default' is not in your gulpfile I double-checked my gulpfile and it appears to be correct: var gulp = require('gulp'), LiveServer = require('gulp- ...

How do I retrieve an index value from an array in GraphQL?

I am seeking a solution for obtaining the index of an array item that is not returned by downstream response. Let's consider my schema: schema: type Cart { items: [Item] } type Item { name: String index: Int } When the data comes in, it lo ...

NextJS is currently unable to identify and interpret TypeScript files

I am looking to build my website using TypeScript instead of JavaScript. I followed the NextJS official guide for installing TS from scratch, but when I execute npm run dev, a 404 Error page greets me. Okay, below is my tsconfig.json: { "compilerOption ...