ES5面向对象基础结构

最新推荐文章于 2024-07-11 17:17:41 发布

weixin_30788239

最新推荐文章于 2024-07-11 17:17:41 发布

阅读量91

点赞数

文章标签：前端 ViewUI

原文链接：http://www.cnblogs.com/xingxingclassroom/p/10386972.html

版权

<!DOCTYPE html>
<html lang="en">
<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">
    <title>ES5面向对象</title>
</head>
<body>
    <script>
        function Test(name,age){//父类
            this.name = name;//配置参数
            this.age = age;
        }

        Test.getClassName = function(){//静态方法
            return 'Test';
        }

        Test.prototype.setName = function(name){//原型方法
            this.name = name;
        }

        Test.prototype.setAge = function(age){//原型方法
            this.age = age;
        }

        Object.defineProperties(Test.prototype,{//原型上添加或修改属性
            info:{
                get:function(){
                    return this.name + this.age;
                }
            },
            job: {
                value: '前端工程师',
                configurable: false,
                writable: true,
                enumerable: true
            },            
        });

        var t1 = new Test('Test',123);
        console.log(t1);//Test {name: "Test", age: 123}

        function NextTest(name,age,num){//子类
            Test.call(this,name,age);//继承配置参数
            this.num = num;
        }

        NextTest.__proto__ = Test;//继承静态方法

        NextTest.prototype = Text.prototype;//继承原型方法

        NextTest.prototype.setNum = function(num){//子类添加新的原型方法
            this.num = num;
        }

        var n1 = new NextTest('NextText',111,123456789);
        console.log(n1);//NextTest {name: "NextText", age: 111, num: 123456789}

    </script>
</body>
</html>

备注：文中多数内容摘自阮一峰老师文章，仅供自我学习查阅。

转载于:https://www.cnblogs.com/xingxingclassroom/p/10386972.html

weixin_30788239

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
ES5面向对象基础结构

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equ...
复制链接

扫一扫