博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
第3章 对象基础
阅读量:4511 次
发布时间:2019-06-08

本文共 1968 字,大约阅读时间需要 6 分钟。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>定义类和对象</title>
</head>
<body>
    1.工厂方式:<br />
    <script type="text/javascript">
        //定义
        function createCar(color, doors, mpg) {
            var oCar = new Object();
            oCar.color = color;
            oCar.doors = doors;
            oCar.mpg = mpg;
            oCar.showColor = function () { alert("1.工厂方式:" + this.color); };
            return oCar;
        }
        //调用
        var car = createCar("red", 4, 23);
        car.showColor();
    </script>
 
    2.构造函数方式:<br />
    <script type="text/javascript">
        //定义
        function Car(color, doors, mpg) {
            this.color = color;
            this.doors = doors;
            this.mpg = mpg;
            this.showColor = function () { alert("2.构造函数方式:" + this.color); };
        }
        //调用
        var car2 = new Car("blue", 4, 23);
        car2.showColor();
    </script>
 
    3.原型方式:<br />
    <script type="text/javascript">
        //定义
        function pCar() { }
        pCar.prototype.color = "green";
        pCar.prototype.doors = 4;
        pCar.prototype.mpg = 23;
        pCar.prototype.showColor = function () { alert("3.原型方式测试:" + this.color); };
        //调用
        var car3 = new pCar();
        alert(car3 instanceof pCar); //允许用instanceof运算符检查给定变量指向的对象的类型。
        car3.showColor();
    </script>
 
    4.混合构造函数/原型方式:<br />
    <script type="text/javascript">
        //定义
        //构造函数定义属性
        function sCar(color, doors, mpg) {
            this.color = color;
            this.doors = doors;
            this.mpg = mpg;
        }
        //原型方式定义函数
        sCar.prototype.showColor = function () { alert("4.混合构造函数/原型方式测试:" + this.color); };
        //调用
        var car4 = new sCar("yellow", 4, 23);
        car4.showColor();
    </script>
 
    5.动态原型方式:<br />
    <script type="text/javascript">
        //定义
        function dCar(color, doors, mpg) {
            this.color = color;
            this.doors = doors;
            this.mpg = mpg;
            //将对象的方法放到对象内部,更符合面向对象思想
            if (typeof dCar._initialized == "undefined") {
                dCar.prototype.showColor = function () { alert("5.动态原型方式测试:" + this.color); };
                dCar._initialized = true;
            }
        }
        //调用
        var car5 = new dCar("black", 4, 23);
        car5.showColor();
    </script>
</body>
</html>

转载于:https://www.cnblogs.com/zhangqs008/archive/2013/05/04/3059779.html

你可能感兴趣的文章
周总结报告
查看>>
Selecting Courses POJ - 2239(我是沙雕吧 按时间点建边 || 匹配水题)
查看>>
Win+R指令(2)
查看>>
codeforces 578c - weekness and poorness - 三分
查看>>
数值微分方程
查看>>
动态规划--电路布线(circuit layout)
查看>>
描边时消除锯齿SetSmoothingMode
查看>>
15回文相关问题
查看>>
将VS2013项目转成VS2010项目的方法
查看>>
[置顶] 怎么对待重复的代码
查看>>
多种方法实现H5网页图片动画效果;
查看>>
Ubuntu/CentOS下使用脚本自动安装 Docker
查看>>
源码解读Mybatis List列表In查询实现的注意事项
查看>>
POJ 2311 Cutting Game(二维SG+Multi-Nim)
查看>>
1978 Fibonacci数列 3
查看>>
1225 八数码难题
查看>>
C#控件的闪烁问题解决方法总结
查看>>
js 冒泡事件与解决冒泡事件
查看>>
2018-2019赛季多校联合新生训练赛第七场(2018/12/16)补题题解
查看>>
后台全选功能以及数据的提交方法
查看>>