What makes this so effective in AngularJS

Here is a code snippet that is working. The question is why can we still use this.review inside the addReview function? It may seem incorrect to reference this.review within the addReview function, as the this variable should typically refer to the addReview function itself and not its parent function. Please correct me if I am mistaken.

app.controller('ReviewCtrl',function() {
    this.review= {};
    this.addReview = function(product) {
        product.reviews.push(this.review);
        this.review={};
    }
});

Answer â„–1

It's not just angular, it's the interplay between JavaScript and inheritance that truly makes sense in this scenario.

If the method were attached to the prototype, you would anticipate this to function as it does in this case. Adding a method within the constructor yields the same outcome, which clarifies why this remains consistent across the child instances.

And why shouldn't it be this way? When considering it, why wouldn't this within a method on the prototype refer back to the constructor—after all, Object-Oriented Programming relies on this behavior for coherence.

function Parent() {

    this.foo = true;

    // This functions equivalently
    this.childOnContructor = function() {
        console.log(this.foo);
    };

}

// Expected functionality 
Parent.prototype.childOnPrototype = function() {
    console.log(this.foo);
}

var parent = new Parent();

parent.childOnContructor();
parent.childOnPrototype();

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

Animated div or fieldset featuring a multi-step form

I have recently put together a detailed step-by-step guide. Each step is wrapped in its own "fieldset" within a single .html file. To navigate back and forth, I have incorporated javascript into the process. However, as time goes on, I am noticing that th ...

The best method for adding information to an already existing data table using ajax

Issue with Loading Additional Records via Ajax Currently, I am working on a project that involves allowing users to search for donor organizations by name. The data is loaded into a DataTable with paging enabled, and the initial data load works perfectly ...

Display HTML content using AJAX within a div element

Within my HTML code, I have the following: <li class="register"><a href="">Registreer</a></li> as well as <div id="content"> </div> I attempted to load an HTML file into the div using the code below in the header se ...

A superior method for implementing CSS keyframe transitions

Currently, I am utilizing the Rico St.Cruz brilliant query.transit library for my work. However, I need to make some changes involving classes instead of CSS transitions. Although I am not very confident in CSS transitions, I attempted to replace: JS: $ ...

Locate the unique symbol within an array

I am facing a challenge with validating user input in an input box where alphanumeric values are allowed along with certain special characters. I need to display an error message if the user enters a special character that is not supported by my applicatio ...

Issue with loading Bootstrap modal correctly

I am currently developing a website using ASP.NET (Framework 4.0). The Master page includes all the necessary Bootstrap and jQuery files, as shown below. <link href="../assets/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" /> ...

Encountering an HTTP parsing failure while sending XML through Angular 5's HttpClient

Struggling to access a local webservice through XML: Take a look at the code below: const httpOptions = { headers: new HttpHeaders({ 'Content-Type': 'text/xml', 'Accept': 'text/xml', 'Response- ...

"Obtain permission from Azure Graph to fetch details for a specific user using their principal

Here is the Node.js code snippet: const GraphkManagementClient = require('azure-graph'); client = new GraphkManagementClient(credentials, tenantId); client.users.get(principalID); The last line triggers an error message: Authorization_Reques ...

What is the best way to dynamically adjust the color of table rows based on an input?

Currently diving into the world of javascript, jquery, and ajax. In need of guidance on how to tackle this particular problem: I have a table listing "expenses" that occur on a monthly basis: Type Cost Monthly/yearly Laundry 2000$ ...

Circular center button in the footer UI

Struggling with aligning a button in the footer perfectly? I have two icons on each side and while the UI is almost there, something seems off with the center icon's padding and shadow. I'm currently working with material-ui. Take a look at the i ...

Using JavaScript to trigger actions via links or buttons inside a table will only function properly in the first row

After multiple consecutive Ajax requests to refill an HTML table, there seems to be a strange issue. The links in the first row of the table are functioning properly and call JavaScript functions, but for any subsequent rows, the links or buttons stop work ...

When transmitting an ajax POST FormData object, the key and value may not be transmitted as originally configured

In my code, I am setting up a FormData object like this: const formData = new FormData(); formData.append('id', '12345678'); Next, I make a POST request using angular HttpClient. However, when I use Postman to debug the reques ...

Struggling to connect CSS and JavaScript files to index.html on Heroku while utilizing Node.js

Trying to set up a Tic Tac Toe game in my app.js file, but encountering some issues with linking files in index.html. app.set('port', (process.env.PORT || 5000)) //serve static files in the public directory app.use(express.static('public& ...

Scroll bar malfunction in Highcharts

I am struggling to get the scroll bar working so that all categories can be displayed. I have tried different approaches but haven't been able to figure out where I'm going wrong. See the code in action here: http://jsfiddle.net/manraj/7racxxu0/ ...

Ways to check the functionality of a controller built using module.config in AngularJS

I've defined a controller in the following way and it works perfectly fine. However, when I try to test this controller, I get an error saying that "(controller name)" is not a function and is undefined. How can I successfully test a controller that&a ...

The AJAX success callback function failed to execute in cases where the dataType was set to JSONP during Cross domain Access

type = 'math'; var ajurl = "sample.com&callback=myhandler"; var datas = "cateid=" + cateid + "&type=" + type + "&pno=" + pno + "&whos=" + whos; $.ajax({ type: "GET", url: ajurl, data: datas, contentType: "application/json; ...

Creating a shared singleton instance in Typescript that can be accessed by multiple modules

Within my typescript application, there is a Database class set up as a singleton to ensure only one instance exists: export default class Database { private static instance: Database; //Actual class logic removed public static getInstance() ...

Integrating dependencies within an Ember model

Looking to inject dependencies into my Ember models. https://github.com/emberjs/ember.js/issues/3670 mentions that this feature is disabled. To enable MODEL_FACTORY_INJECTIONS, there is a guide at https://github.com/stefanpenner/ember-cli/blob/master/blue ...

Pressing the Enter key will submit the form in the textbox

I am looking to automatically submit a form by pressing the enter key while in a text box. Below is my HTML code: <form class="locationform" id="locationform" method="get"> <fieldset class="col-md-12 center" id="Searchform"> <h4>&l ...

Utilizing Express to send a GET request to a search bar

I recently added a search bar to the homepage of my website. Users can input a string into the search bar, which will then be sent as a GET request. I am attempting to retrieve all data from my MongoDB where the input string is found within the name field. ...