What is the best way to attach 'this' to an object using an arrow function?

Consider having an object named profile which consists of properties name and a method called getName (implemented as an arrow function).

profile = {
    name: 'abcd',
    getName: () => {
        console.log(this.name);
    }
}

I am interested in how to execute the getName method while preserving it as an arrow function, without converting it into a regular function.

Is there a way to achieve the output abcd by calling getName(), possibly utilizing expressions within getName?

Could the use of call() or bind() be beneficial in this context? If so, in what manner?

PLEASE MAINTAIN THE ARROW FUNCTION AND AVOID REGULAR FUNCTION CONVERSION

-- MODIFIED --

I am simply intrigued by how arrow functions can be employed within objects to yield outcomes similar to those produced by traditional functions.

This inquiry arose during an interview discussion.

Answer №1

To access the name property from the inner function without converting it to a regular function, you can only do so by accessing the outer variable name, which in this case is profile:

const profile = {
    name: 'abcd',
    getName: () => {
        console.log(profile.name);
    }
}

profile.getName();

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

Can I use Javascript to make changes to data stored in my SQL database?

I am delving into the realm of SQL and Javascript, aiming to insert my variable ("Val_Points from javascript") into a table ("Usuarios") associated with a specific user (e.g., Robert). Is it possible to achieve this using JavaScript, or are there alternati ...

Angular 2 - Graphic Representation Tool for Visualizing Workflows and Processes - Resource Center

Looking for a library that can meet specific requirements related to diagram creation and rendering. We have explored jsplumbtoolkit, mermaid, and gojs, but none of these fully satisfy our needs. For example, we need the ability to dynamically change con ...

Using three.js to retrieve the camera's position using orbit controls

In my journey using three.js orbit controls, I have encountered a challenge of making a skybox follow the camera's position. Despite scouring the internet, I have not come across a suitable solution. My query is straightforward - how can I obtain the ...

Generating a multidimensional associative array based on user inputs from a form

What is the best way to transform form input data into a multidimensional associative array? This is how the form appears: <div id="items"> <h4>Engraving Text</h4> <div class="item" data-position="1"> <h4 id="en ...

The AWS API Gateway quickly times out when utilizing child_process within Lambda functions

I'm encountering an issue with my Lambda function being called through API Gateway. Whenever the Lambda triggers a spawn call on a child_process object, the API Gateway immediately returns a 504 timeout error. Despite having set the API gateway timeou ...

Bootstrap 4: The mystery behind why the popover fails to appear inside a scrollable dropdown

Is there a way to replicate the behavior of Bootstrap 3 dropdowns with scrollbars on hover and popovers in Bootstrap 4? It seems that setting overflow:hidden; for scrolling functionality in dropdown menus also hides the popover. I have tried using containe ...

Error: The react render method is unable to determine the length of an undefined property

I created this component to extract the length of the followers array in order to display the number of followers each user has on their profile. The fetchUser() function is used to call a backend API, and I implemented Redux and Reselect for state managem ...

In React's contextApi, the this.context object is constantly devoid of any values

sample.js export default class SampleComponent extends React.Component { static contextType= AppProvider; componentDidMount() { console.log('sample',this.context); } render() { return ( <AppConsumer> ...

Using setTime in JavaScript allows for customizing and adjusting the

I'm having trouble getting this code to display the time. I thought it would work, but it's not showing the time. Can someone please help me figure out what's going wrong? function startTime() { var currentTime = new Date(); ...

Looking to identify the type of a adorned class in Typescript?

Consider the following scenario: return function IsDefined(object: any, propertyName: string) { .... ] We then go ahead and decorate a property like this: class Test { @IsDefined() p1: String = ""; } Now, when we execute a test inside the ...

The media parameter seems to be malfunctioning when attempting to send it to the Kaleyra API using code

Attempting to send media through the Kaleyra API using my code is proving unsuccessful. However, when I make the same request via Postman, it works perfectly fine. async whatsappAPIWithAttachment(requestBody) { let api_key = ""; if (requ ...

The d3.js Force Directed Graph is not working as expected

I keep encountering an error in the dev console whenever I attempt to run my code. The errors are as follows: Error: missing: 1 3d-force-graph:5:22166 TypeError: r.attributes.position is undefine You can view the live version of the faulty code here: He ...

Transform JSON into an Array and generate a new Array from a collection of Arrays

I'm struggling with generating a table in Angular2 from JSON data because I need to pivot the information, but my usual method doesn't seem to work for this scenario. Below is an excerpt of the JSON data I am working with: [ { "ValueDate" ...

Discovering the smallest, largest, and average values across all properties in an array of objects

Given an array of objects with varying values, the task is to determine the minimum, maximum, and average of the properties in that array. For example, consider the following array: const array = [{ "a": "-0.06", "b": "0.25", "c": "-0.96", ...

Is there a way to filter and tally the JSON objects that have latitude and longitude within a 10km radius from the

I'm currently working on filtering and counting objects from an API endpoint that fall within a 10km radius of the specified origin. My main challenge lies in correctly filtering the API results and tallying the number of matching items. While I succ ...

Whoops! Unable to interpret properties from an undefined source while trying to retrieve 'get'

Every time I execute my program, I encounter the following error: Cannot read properties of undefined (reading 'get') TypeError: Cannot read properties of undefined (reading 'get') at Proxy.mounted (webpack-internal:///./node_module ...

Automatically reset the form after submission in CakePHP 1.3

I've encountered an issue with my report form that is linked multiple times on a page to a jQuery dialog box. To prevent cross-posting, I added a random string to the submission process. After successfully submitting the form on a single page access, ...

Access scope information when clicking with ng-click

I am currently using a php api to update my database, but I want the ability to choose which item gets updated with ng-click. app.controller('ReviewProductsController', function ($scope, $http) { $scope.hide_product = function () { ...

Learn how to trigger the keydown function in VUE programming

I am trying to create a method that will be triggered whenever any key on the keyboard is pressed, regardless of where the focus is. I want to be able to determine which key was pressed in this method. Currently, I have set up an event listener for keydow ...

Adding a query parameter to my website causes a particular element to fail to display on the page

I'm facing a challenge in sharing my code, but since my project is open source, you can find the code here. I've noticed that when I receive a link from another site with /? at the end, it causes an issue on my website where the hero image secti ...