angularjs scope(作用域)

什么是angularjs作用域:
1、scope(作用域)是应用在html(视图)和javascript(控制器)之间的纽带
2、scope是一个对象,有可用的方法和属性。
3、scope可应用在视图和控制器上。
怎么使用scope
我们在创建了控制器后,可以将$scope对象当作一个参数来传递:
例如:

在上面的代码中,我们创建了myCtrl控制器,并将$scope对象当做参数传递给了函数.
实例:
{{name}}
上面的代码是一个简单的$scope作用域的实例,其实我们应该能够看出来,$scope可以设置html控制器中的任何变量,并为其赋值,最终结果绑定在了html视图层.
注意:
其实scope是一个大的概念,scope是mvc组成下的产物,也就是view(视图)即html、model(模型)当前视图中可用的数据、controller(控制器)即javascript函数,可以添加或修改属性。
例如:

{{myInfo}}

运行上面的代码结果如下图所示:
angularjs scope(作用域)_第1张图片
注意这是初始化运行后执行了一次点击事件后看到的效果,当我们修改输入框中的值时,再次点击你会发现下面的值变为你好+新的值。
根作用域
所有的应用都会有一个$rootScope,它可以作用在ng-app指令包含的所有html元素中。$rootScope可用于整个应用中,是各个controller中scope的桥梁,用于scope的桥梁,用rootScope定义的值,可以在各个controller中使用。
例如:
{{one + " " + two + " " + three + " " + four}}
{{one + " " + two + " " + three + " " + four}}
angularjs scope(作用域)_第2张图片
其实$rootScopt就是一个全局对象,我们在控制器层,也就是js中设置的$rootScopt跟作用域,很明显在视图层,也就是在html中都能够访问到,但是在控制器1也就是myCtrl_1中通过 console.log($rootScope.four);方式来打印出myCtrl_2里面的 $rootScope.four = "全局2";的值却是"undefined"也就是说在myCtrl_1控制器中并没有找到变量four的值,但是 console.log($rootScope.two);却是可以将two的值打印出来,这也就说明了浏览器解析angularjs的规则,跟解析原生javascript是一样的,从上往下解析执行脚本,由于没有存在预解析,或变量提升的状况,所以 console.log($rootScope.four);执行的结果只能为undefined.
总结:
$scope:
对于$scope它的作用域就是视图层中对应的控制器部分,为什么是对应的控制器,因为在实际项目中为了满足开发者的需求我们需要创建的controller控制器不仅仅只有一个,这时我们必须要清楚此时的$scope对应的是哪个控制器。
$rootScope:
是属于全局作用域,对于这个根作用域我们需要注意两点。
1、在视图层中我们可以在任何地方去调用它设置的属性值,没有不同控制器的限制。
2、在js中我们不能忽视浏览器解析js脚本的规则来向下调用变量,这样会输出undefined,但是由下向上访问是可以的。

扩展:
1、this的指向
1、总是指向函数的直接调用者。
2、如果有new实例化对象,那么this就指向这个new出来的实例化对象。
3、如果是在事件中的话,那么this将指向触发该事件的那个对象。
其实从某种意义上来理解$scope,它与this是有着相同性的。
(如果想了解更多关于this与面向对象的内容,可查阅我的博文 javascript之基础部分、javascript之面向对象编程 中的相关类容)
2、变量提升,预解析(如果想深入了解变量提升以及预解析的内容可以查阅我的博文 javascript预解析 )。
3、什么是undefined,以及什么情况下会输出undefined?
什么是undefined?
undefined是一个表示“无”的原始值,它与null不同,null是“无”的对象,当我们将null转化成数值时,null的值为“0”,但是undefined转换成数值的时候是“NaN”意思就是说不是数值。简单的理解就是undefined表示“无”的时候就是“无”就是不存在的意思,什么都没有。
那么都在什么情况下会出现undefined呢?
我们在开发的过程中时常会出现undefined,大致有以下几种情况会出现undefined。
1、当我们创建了变量,但是没有为其赋值的时候,如果调用这个变量就会出现undefined。
2、当调用函数时,应该提供的参数我们没有提供,这时候该参数就是undefined。
3、对象没有赋值属性,该属性的值为undefined。
4、当我们构造了函数但是却没有返回值的时候,这时默认返回的就是undefined。
如有理解不当之处,欢迎各位老铁留言指正。谢谢!!!!

你可能感兴趣的:(AngularJS学习笔记,this指向,angularjs,作用域,什么是undefined,变量提升)