AngularJs-06-作用域继承

更新时间：2022-06-19 09:44:50
<!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>
上一篇 : ：JVM系列-001-JVM监控工具下一篇 : AngularJs-05-模拟购物车
AngularJs-06-作用域继承

相关阅读

推荐文章
