<!DOCTYPE html>
<html lang="zh" ng-app="myapp">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<script src="../bower_components/angular/angular.js" type="text/javascript" charset="utf-8"></script>
<title>AngularJs-作用域继承</title>
</head>
<body>
<div ng-controller="outController">
<h1>{{username}}</h1>
<div ng-controller="innerController">
<h1>{{username}} {{realname}}</h1>
</div>
<div ng-controller="innerController2">
<h1>{{username}} {{realname}}</h1>
</div>
</div>
<script type="text/javascript">
var app = angular.module("myapp",[]);
app.controller("outController", function($scope){
$scope.username="out name";
});
app.controller("innerController", function($scope){
$scope.username="innerController name";
});
app.controller("innerController2", function($scope){
$scope.username="innerController2 name";
});
// call apply 寄生继承
function Part(name, age){
this.name = name ;
this.age = age ;
this.eat = function(){
console.log("Part eat");
};
};
function Children(name, age){
Part.call(this, name, age);
this.sleep = function(){
console.log("Children sleeping ");
}
}
var children = new Children("bilaisheng", 18);
console.log(children.name);
console.log(children.age);
children.eat();
children.sleep();
// 对象之间实例继承
function Person(name, age){
this.name = name;
this.age = age;
this.arr =[];
}
//person的属性和方法是来自两个部分:
//1:一个部分是来自构造函数(复制过来,对象自有属性 obj.hasOwnProperty("name"))
//2:来自原型对象(_proto_)进行的原型映射
var person = new Person("bilaisheng", 18);
// 单对象继承
var student = Object.create(person);
student.arr.push("javascript");
student.name = "zhangsan";
console.log(student.name+"--->"+student.age+"--->"+student.arr);
console.log(person.name+"--->"+person.age+"--->"+person.arr);
</script>
</body>
</html>
AngularJs-06-作用域继承
最新推荐文章于 2024-08-30 10:14:48 发布