JavaScript: Incorporating an operator into a specific object (instead of the entire class)

Are you familiar with how to include an operator in an object (rather than the entire class)? When it comes to a method, I know you can achieve that by:

my_object.new_function = function(){return 1};

Then invoking my_object.new_function() will output 1.

However, what I'd like to do is apply the get operator to access my_object.new_function directly instead of using my_object.new_function().

Answer №1

There are a multitude of methods -

let obj = {
  get propX() {
    return 1
  }
}

console.log(obj.propX)
// 1

obj = {
  ...obj,
  get propY() {
    return 2
  }
}

console.log(obj.propX, obj.propY)
// 1 2

Object.assign(obj, { get propZ() { return 3 } })
console.log(obj.propX, obj.propY, obj.propZ)
// 1 2 3

Getters function like regular functions and thus capture their surroundings -

let obj = {
  get propA() { return 1 }
}

let variableB = 2

obj = {
  ...obj,
  get propC() { return variableB } // <- dynamic
}

console.log(obj.propA, obj.propC)
// 1 2

variableB = 999

console.log(obj.propA, obj.propC)
// 1 999

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

Google Scripts: Generating a set of data to include in an email

As a newcomer to Google Script and JavaScript, I'm on a mission to email a list of file names extracted from a spreadsheet. The names reside in a column within my sheet, and after defining a variable called "newfiles" to cherry-pick only the necessary ...

retrieve the month and year data from the input date

I encountered a situation where I'm working with the following unique HTML code: <input type="date" id="myDate"/> <button type="button" class="btn btn-secondary" id="clickMe">MyButton</ ...

What is the best way to delay an observable from triggering the next event?

In my Angular project, I am implementing RxJs with two subjects. s1.next() s1.subscribe(() => { // perform some operation and then trigger the event for s2 s2.next() }); s2.subscribe(() => { // perform some operat ...

Discovering Angular 2 Service Change Detection

Exploring the Angular 2 beta has led me to some challenges with understanding the change detection mechanism. I have put together a simple Plunker example that demonstrates an issue I am encountering. //our root app component import {Component, Injectab ...

Is utilizing the correct use case for a Bunyan child logger?

I've recently started exploring bunyan for logging in my nodejs application. After giving it a try, everything seems to be functioning quite smoothly. Initially, I overlooked a section on log.child, but now I am eager to understand its usage. It appea ...

trouble with phonegap javascript ajax integration

I'm new to app development and I've been trying to create a mobile app using PhoneGap. I have a remote shared server that contains a MySQL table. My goal is to sign up a user, then send the data via JavaScript and AJAX to a PHP server page that w ...

When data is submitted through the POST method, it mysteriously disappears

When I send the "user" variable to another page called Survey.php, here's how it looks: In the index.html file: <form action="Survey.php" method="post" name="frm"> <div><input type="text" name= ...

Generate a random number to select a song file in Javascript: (Math.floor(Math.random() * songs) + 1) + '.mp3'

My current JavaScript code selects a random song from the assets/music folder and plays it: audio.src = path + 'assets/music/'+(Math.floor(Math.random() * songs) + 1)+'.mp3' However, I've noticed that sometimes the same trac ...

How to modify a nested object in MongoDB based on the JSON data provided

In my possession, there exists a structured form of JSON data as displayed below: [ {"size":100,"year":2015,"geography":"London","age":"21","gender":"Female"}, {"size":80,"year":2015,"geography":"Cardiff","age":"38","gender":"Male"}, {"size":80,"year":201 ...

Trouble displaying image due to issues with javascript, html, Angular, and the IMDb API integration

I have been working on displaying images from the IMDb API in my project. Everything works perfectly fine when I test it locally, but once I deploy the project to a server, the images do not load initially. Strangely, if I open the same image in a new tab ...

Navigating the express subdomain

I'm currently utilizing the package express-subdomain. The issue is that the router handling subdomain requests is the same as the one handling non-subdomain requests. I suspect there's an error in my 'app.js' configuration. How shoul ...

Unusual issue in IE causing rendering problems in reporting services

Currently, I am creating a report using Reporting Services 2008, MVC 2, and Ajax as my development technologies. When I generate the report, everything displays perfectly if there is data present. However, if there is no data, the report body gets cut off ...

What steps should I take to resolve the textarea border bottom CSS effect?

My simple border bottom animation is working fine with a basic input element, but it's not functioning properly when used with a textarea. (If using JavaScript is necessary for a solution, please provide guidance) How can I adjust the height of a te ...

Customize node.js response by overriding or adding another return statement

I have two variables, FirstName and LastName, that I need to include in the response data. It is important to note that the FirstName and LastName are not stored in the Student table. let result = await Student.get(id) let FirstName = "Paul" let LastName ...

The occurrence of the error "Failed to resolve component" in Vue 3.0.11 seems to be random, particularly when using recursive components

After thoroughly checking all similar questions on this platform, I did not find any relevant solutions. In most cases, the error seems to occur when utilizing components:[comp1,comp2] This is incorrect because the components property should be an object. ...

Exclusive to Safari: Codesandbox is experiencing difficulties retrieving data from the localhost server

Would you mind helping me out with this technical issue I'm facing? For the server/API, I am using this link. As for the mock website, it can be found at this URL. The problem is that, in my code, I'm using axios to fetch data from the locally h ...

What could be preventing this AJAX call from running correctly?

I am in the process of developing a website that provides users with a discount based on a promotional code they can input. It is important for me to verify the validity of the code in our database before allowing a new sign-up to proceed. Below is the AJA ...

How can a JavaScript function be imported into a React component from a location outside the src folder?

I have a utility function in my JavaScript utils.js file within the Django static files. I am looking to make this file accessible for use with React as well. I would like to import this file along with its functions into a React component. Here is an ex ...

One package in Node.js, a pair of dependencies, and a single export utilizing ES6 syntax

Currently, the library contains multiple frameworks in one npm module (which is admittedly not the best practice). However, as we work on splitting the library into separate JS framework specific repositories like React, JQuery, Angular, etc., I'm fac ...

Combining two variables in AngularJS seamlessly, without explicit instruction

In the realm of Controllers resides my beloved home.js: angular.module("HomeApp", ["BaseApp"]) .controller("MainCtrl", ["$http", "$window", "BaseService", function($http, $window, BaseService) { var self = this; self.posts = BaseServ ...