转自:http://www.lovelucy.info/understanding-scopes-in-angularjs.html

JavaScript 的原型链继承

假设父类 parentScope 有如下成员属性 aString, aNumber, anArray, anObject, 以及 aFunction。子类 childScope 原型继承父类 parentScope,于是我们有:

如果子 Scope 尝试去访问 parentScope 中定义的属性,JavaScript 会先在子 Scope 中查找,如果没有该属性,则找它继承的 scope 去获取属性,如果继承的原型对象 parentScope 中都没有该属性,那么继续在它的原型中寻找,从原型链一直往上直到到达 rootScope。所以,下面的表达式结果都是 ture:

childScope.aString === 'parent string'
childScope.anArray[1] === 20
childScope.anObject.property1 === 'parent prop1'
childScope.aFunction() === 'parent output'

假设我们执行下面的语句

childScope.aString = 'child string'

原型链并没有被查询,反而是在 childScope 中增加了一个新属性 aString。这个新属性隐藏(覆盖)了 parentScope 中的同名属性。在下面我们讨论 ng-repeat 和 ng-include 时这个概念很重要。

假设我们执行这个操作:

childScope.anArray[1] = '22'
childScope.anObject.property1 = 'child prop1'

原型链被查询了,因为对象 anArray 和 anObject 在 childScope 中没有找到。它们在 parentScope 中被找到了,并且值被更新。childScope 中没有增加新的属性,也没有任何新的对象被创建。(注:在 JavaScript 中,array 和 function 都是对象)

假设我们执行这个操作:

childScope.anArray = [100, 555]
childScope.anObject = { name: 'Mark', country: 'USA' }

原型链没有被查询,并且子 Scope 新加入了两个新的对象属性,它们隐藏(覆盖)了 parentScope 中的同名对象属性。

应该可以总结

  • 如果读取 childScope.propertyX,并且 childScope 有属性 propertyX,那么原型链没有被查询。
  • 如果设置 childScope.propertyX,原型链不会被查询。

最后一种情况,

delete childScope.anArray
childScope.anArray[1] === 22  // true

我们从 childScope 删除了属性,则当我们再次访问该属性时,原型链会被查询。删除对象的属性会让来自原型链中的属性浮现出来。

AngularJS 的 Scope 继承

  • 创建新的 Scope,并且原型继承:ng-repeat, ng-include, ng-switch, ng-view, ng-controller, directive withscope: true, directive with transclude: true
  • 创建新的 Scope,但不继承:directive with scope: { ... }。它会创建一个独立 Scope。

注:默认情况下 directive 不创建新 Scope,即默认参数是 scope: false

转载于:https://www.cnblogs.com/bonelee/p/6090689.html

angularjs 中的scope继承关系——(1)相关推荐

  1. angularjs 中的scope继承关系——(2)

    转自:http://www.lovelucy.info/understanding-scopes-in-angularjs.html angularjs 中的scope继承关系 ng-include ...

  2. angularjs中的$scope和$rootScope

    (1)每个控制器的实例都对应一个作用范围对象,即$scope (2)在控制器中声明的Model数据,必须保存在一个作用范围内 (3)一个HTML中可以声明多个控制器实例,每个控制器都有自己的作用范围, ...

  3. python中的序列类型数据结构元素的切片操作_PythonI/O进阶学习笔记_4.自定义序列类(序列基类继承关系/可切片对象/推导式)...

    前言: 本文代码基于python3 Content: 1.python中的序列类分类 2. python序列中abc基类继承关系 3. 由list的extend等方法来看序列类的一些特定方法 4. l ...

  4. 类与类之间的关系:依赖关系和关联关系及继承关系中self是什么? 类里面的特殊成员...

    类与类之间的关系 ⼤千世界, 万物之间皆有规则和规律. 我们的类和对象是对⼤千世界中的所有事物进行归 类. 那事物之间存在着相对应的关系. 类与类之间也同样如此. 在⾯向对象的世界中. 类与类 中存在 ...

  5. Angularjs中的IGGird创建和使用

    AngularJs Ignite 中的Iggrid 官网:http://www.igniteui.com/grid/angular Angularjs的Iggrid使用有两种方式,第一种为iggrid ...

  6. Java面试题 20在面向对象编程里,经常使用is-a来说明对象之间的继承关系

    Java面试题 20在面向对象编程里,经常使用is-a来说明对象之间的继承关系,下列对象中不具备继承关系的是?() A:手机与小米手机 B:企业家与雷军 C:编程语言与Java D:中国与北京 类之间 ...

  7. linux 变量的继承,solaris移植到linux的大坑:bash和sh中环境变量继承的差异

    问题的引出 项目中脚本A .B,A调用B, 其中A中所有命令均使用绝对路径,B中直接使用 在solaris上工作正常,移植到linux中报错: /syscom/lm/linux//backupgen: ...

  8. android studio 继承关系 快捷键,Android Studio快捷键

    快捷键,加粗的是经常会使用的描述 Ctrl+E打开最近操作的文件 Ctrl+Z撤销 Ctrl+Shift+Z重做(在Eclipse中使用的是Ctrl+Y) Ctr+Y删除该行(Eclipse中的删除该 ...

  9. Hibernate中的Entity类之间的继承关系之一MappedSuperclass

    在hibernate中,Entity类可以继承Entity类或非Entity类.但是,关系数据库表之间不存在继承的关系.那么在Entity类之间的继承关系,在数据库表中如何表示呢? Hibernate ...

最新文章

  1. 读取word对应页码_毕业论文怎样自动生成目录及从任意页开始排页码
  2. 【已解决】可以访问Tomcat下webapp中的文件目录(间接实现下载功能)
  3. 关于maven依赖中的scopeprovided/scope使用
  4. 2016蓝桥杯省赛---java---B---1(煤球数目)
  5. 用户态程序阻塞原因_进程阻塞 操作系统某种情况进行进程的阻塞和唤醒操作...
  6. selenium 谷歌驱动 下载网址
  7. 中国最美的经典古文名篇Top10,它们也是你心中的白月光吗?
  8. 【数据挖掘算法】(一)MSET 算法
  9. Elasticsearch:Apache spark 大数据集成
  10. 左手鼠标指针_使您的鼠标指针左手友好
  11. Sketch 快捷键速记表(中英对照)
  12. 【项目实战】Python基于孤立森林算法(IsolationForest)实现数据异常值检测项目实战
  13. 图学习——04.HAN(异构图注意力网络)
  14. 手眼标定AX=XB求解方法(文献总结)
  15. [python] NetworkX实例
  16. 基金业务中常见费用知识
  17. JS安全防护算法与逆向分析——新浪微博登录JS加密算法
  18. 墨者靶场--手工注入mysql数据库
  19. 服务器linux安装后没有网卡驱动,解决安装Linux之后没有网卡驱动
  20. 干货|红蓝攻防实战演练技术汇总

热门文章

  1. Python Train_机器学习--基于Python的简单线性回归
  2. php中条件查询语句,thinkphp3.2框架中where条件查询用法总结
  3. linux启动脚本 范本,Linux—微服务启停shell脚本编写模板
  4. 计算机用户停用无法登录,电脑开机无法登录提示您的账户已被停用如何解决。 如何解决电脑开机无法登录提示您的账户已被停用的问题。...
  5. php点选按钮ajax,php – 在单选按钮上显示div中的数据单击ajax
  6. docker客户端连接远程服务器
  7. python【蓝桥杯vip练习题库】BASIC-27 2n皇后问题(八皇后问题 搜索)
  8. 优秀的中文分词第三方库——jieba
  9. abovedisplayskip无效_latex减少图片和图片解释文字之间的距离、调整公式与正文间距离,调整空白大小:...
  10. java中的默认排序规则,C#中列表,集合排序Sort,OrderBy与Java排序规则默认不一致...