zoukankan      html  css  js  c++  java
  • coffeescript之面向对象初体验

    在没有使用coffee-script之前,我们写类是这样写的,感觉会有点繁锁:

    //-------------抽象类形状--------------
    function Shape(edges) {
        this.edges = edges;
    }
    
    Shape.prototype.getArea = function() {
        return -1;
    }
    
    Shape.prototype.getEdges = function() {
        return this.edges;
    }
    //--------------三角形---------------- function Triangle(bottom, height) { Shape.call(this, 3); this.bottom = bottom; this.height = height; } //继承 Triangle.prototype = new Shape(); //重写方法 Triangle.prototype.getArea = function() { return 0.5 * this.bottom * this.height; }
    //---------------矩形---------------- function Rectangle(bottom, height) { Shape.call(this, 4); this.bottom = bottom; this.height = height; } //继承 Rectangle.prototype = new Shape(); //重写方法 Rectangle.prototype.getArea = function() { return this.bottom * this.height; }
    //-------------测试------------------- var tri = new Triangle(4, 5); document.write(tri.getEdges() + "<br>"); document.write(tri.getArea() + "<br>"); var rect = new Rectangle(20, 40); document.write(rect.getEdges() + "<br>"); document.write(rect.getArea() + "<br>");

    我们使用coffee-script写的话只要象下面这样写就可以了,看起来优雅了很多,对于习惯了java等语言的面向对象方式开发的人来说,这种方式好理解多了,而且代码少了一半。

    class Shape 
      constructor: (@edges) ->
      getEdges : () -> @edges
      calcArea : () -> -1
    
    class Triangle extends Shape
      constructor : (@bottom, @height) -> super 3
      calcArea : () -> @bottom*@height*0.5
      
    class Rectangle extends Shape
      constructor : (@bottom, @height) -> super 4
      calcArea : () -> @bottom*@height
      
    tri = new Triangle 4,5
    rect = new Rectangle 4,5
    
    console.log tri.getEdges()
    console.log tri.calcArea()
    
    console.log rect.getEdges()
    console.log rect.calcArea()

    实际后台生成的js文件内容是:

    (function() {
        var Rectangle, Shape, Triangle, rect, tri;
        var __hasProp = Object.prototype.hasOwnProperty, __extends = function(child, parent) {
            for (var key in parent) {
                if (__hasProp.call(parent, key))
                    child[key] = parent[key];
            }
            function ctor() {
                this.constructor = child;
            }
    
            ctor.prototype = parent.prototype;
            child.prototype = new ctor;
            child.__super__ = parent.prototype;
            return child;
        };
        Shape = (function() {
            function Shape(edges) {
                this.edges = edges;
            }
    
            Shape.prototype.getEdges = function() {
                return this.edges;
            };
            Shape.prototype.calcArea = function() {
                return -1;
            };
            return Shape;
        })();
        Triangle = (function() {
            __extends(Triangle, Shape);
            function Triangle(bottom, height) {
                this.bottom = bottom;
                this.height = height;
                Triangle.__super__.constructor.call(this, 3);
            }
    
            Triangle.prototype.calcArea = function() {
                return this.bottom * this.height * 0.5;
            };
            return Triangle;
        })();
        Rectangle = (function() {
            __extends(Rectangle, Shape);
            function Rectangle(bottom, height) {
                this.bottom = bottom;
                this.height = height;
                Rectangle.__super__.constructor.call(this, 4);
            }
    
            Rectangle.prototype.calcArea = function() {
                return this.bottom * this.height;
            };
            return Rectangle;
        })();
        tri = new Triangle(4, 5);
        rect = new Rectangle(4, 5);
        console.log(tri.getEdges());
        console.log(tri.calcArea());
        console.log(rect.getEdges());
        console.log(rect.calcArea());
    }).call(this);

     如果你想详细了解coffee-script的内容,访问以下链接:http://blog.csdn.net/zfc2201/article/details/8551013

  • 相关阅读:
    转载: RAID详解[RAID0/RAID1/RAID10/RAID5]
    用户交互式命令:read
    linux下fdisk分区管理、文件系统管理、挂载文件系统等
    linux文件系统下的特殊权限
    find命令详解
    python3中 getpass模块使用
    个人shell积累
    手把手教你利用爬虫爬网页(Python代码)
    数通HCIP-ospf知识点
    HCIE之路--超全ospf思维导图
  • 原文地址:https://www.cnblogs.com/zfc2201/p/2881511.html
Copyright © 2011-2022 走看看