-2

could anyone explain what's the difference between inherit and extend in AngularJS?

many thanks!

Lior

EDIT: look here: github.com/angular/angular.js/blob/master/src/Angular.js and search for 'inherit' to find it (line 246 currently)

Lior
  • 40,466
  • 12
  • 38
  • 40
  • Could you be a bit more specific? Are you talking about angular.extend()? – F Lekschas Mar 22 '13 at 21:10
  • I think the docs are pretty clear about what the extend method does. It just copies all properties from the source objects to the destination object. – F Lekschas Mar 22 '13 at 21:30

1 Answers1

0

There is no inherit function in Angular.

Extend just copies properties from one object to another. It's a common bit of JavaScript juju. JQuery has an extend function as well.

var x = { foo: 'hello' };
var y = { bar: 'world' };    
angular.extend(x, y);    
console.log(x); //{ foo: 'hello', bar: 'world' }

The only inheritance I can presume you're talking about in Angular would be how child scopes inherit the properties of the parent scopes. You're quite right that there is a difference here, because it's not done via anything like extend... it's done via prototypical inheritance. Where the parent scope is actually the prototype of the child scope. This means that when you try to access a property on a child scope that doesn't exist, it will fall down to it's prototype and check that property, if it doesn't exist there, it will fall down to THAT prototype and check the property there.

This means that when you update the property on a parent, it updates for all of it's children... HOWEVER, if you update for a child, it will not update the parents... because it sets the property directly on the child, and not on it's prototype (which is the parent).

If that's not clear, there are a ton of blog entries / StackOverflow questions about this already:

Community
  • 1
  • 1
Ben Lesh
  • 107,825
  • 47
  • 247
  • 232
  • 1
    thanks @blesh but there is an inherit function: function inherit(parent, extra) { return extend(new (extend(function() {}, {prototype:parent}))(), extra); } – Lior Mar 25 '13 at 13:16
  • Interesting, where does that exist? and in what version? – Ben Lesh Mar 25 '13 at 15:42
  • I've looked through every version, and there is no inherit function in Angular. Perhaps this function is coming from another library you've included? – Ben Lesh Mar 25 '13 at 15:51
  • Still nothing? Where is this inherit function? – Ben Lesh Mar 26 '13 at 03:09
  • Hi @blesh, if you look here: https://github.com/angular/angular.js/blob/master/src/Angular.js and search for 'inherit' you'll find it – Lior Mar 26 '13 at 13:54
  • 1
    That's not even publicly exposed. It's wrapped in a closure. Angular, the framework, the API, has no inherit method that you can use. – Ben Lesh Mar 26 '13 at 15:50
  • thanks @blesh for this. I'm trying to understand Angular internals, in order to debug my app properly, as well as angular-ui components that uses the internal concepts, too. – Lior Mar 26 '13 at 17:42
  • 1
    If you need to dig in that deep when debugging your app, you took a wrong turn somewhere. In any case private and API methods are not comparable. – JJJ Mar 26 '13 at 17:47
  • @Juhana Yes I do need sometimes to dig deeper - either to solve a bug I have, to understand other people techniques (angular-ui uses 'inherit') or just out of curiosity. not sure why I got voted down. maybe angular internals better belong in angular mailing list. thanks anyways – Lior Mar 27 '13 at 16:14