美文网首页
对象、原型

对象、原型

作者: StarLikeRain | 来源:发表于2016-09-23 10:09 被阅读53次

    问答

    • OOP 指什么?有哪些特性 (难度: ***)
      OOP(object oriented programming)是指面向对象编程,
      封装性:把客观的事物封装成抽象的类,并且类可以把自己的数据和方法只给可信的类操作, 对不可信的信息进行隐藏。
      继承性:他可以使用现有类的功能,并且可以在不重新编写原来类的情况下,进行扩展。
      多态性:允许将子类类型的指针赋值给父类类型的指针,就是允许将父对象设置成为一个或多个字对象对等的技术。赋值之后,父对象就可以根据当前赋值给他的字对象的特性以不同的方式运作。

    • 如何通过构造函数的方式创建一个拥有属性和方法的对象? (难度: ***)
    <script>
        function zxc(name, age) {
            this.a = name;
            this.b = age;
        }
        zxc.prototype = {
            behavior: function () {
                console.log(this.a + ' is ' + this.b + ' yep');
            }
        }
        var asd = new zxc('I-wipe', 3);
        asd.behavior();//console.log('I-wipe is 3 yep');
    </script>
    

    • prototype 是什么?有什么特性 (难度: ***)
      prototype是function自带的属性,function也是一个对象,prototype也是一个对象。prototype里面有两个东西,一个是指向object,还有一个是指向这个目前function本身constructor。
    prototype...
    • 画出如下代码的原型图 (难度: ****)
    function People (name){
      this.name = name;
      this.sayName = function(){
        console.log('my name is:' + this.name);
      }
    }
    
    People.prototype.walk = function(){
      console.log(this.name + ' is walking');  
    }
    
    var p1 = new People('谷谷谷鸟');
    var p2 = new People('前端');
    

    原型图待做......


    • 以下代码中的变量age有什么区别(难度: ****)
    function People (){
      var age = 1//局部变量age = 1;
      this.age = 10;//谁调用谁会获得一个buff。age = 10;
    }
    People.age = 20;//给函数对象一个age = 20。看图
    
    People.prototype.age = 30;//给函数的原型一个age = 30;
    
    age.png

    代码

    • 创建一个 Car 对象,拥有属性namecolorstatus;拥有方法runstopgetStatus (难度: **** )
    <script>
        function Car(name, color, status) {
            this.name = name;
            this.color = color;
            this.status = status;
        }
        Car.prototype = {
            run : function () {
                console.log('runnnnn')
            },
            stop : function () {
                console.log('stoppppppp')
            },
            getStatus: function () {
                console.log(this.status)
            }
        }
        var car = new Car('a', 'b', 'c');
        car.run();
        car.stop();
        car.getStatus();
    </script>
    

    • 创建一个 GoTop 对象,当 new 一个 GotTop 对象则会在页面上创建一个回到顶部的元素,点击页面滚动到顶部。拥有以下属性和方法 (难度: ****)
    • ct属性,GoTop 对应的 DOM 元素的容器
    • target属性, GoTop 对应的 DOM 元素
    • bindEvent 方法, 用于绑定事件
    • createNode 方法, 用于在容器内创建节点

    • 使用构造函数创建对象的方式完成轮播功能( 查看demo ),使用如下调用方式
    function Carousel($node){
    //todo...
    }
    Carousel.prototype = {
    //todo ..
    };
    var $node1 = $('.ct').eq(0);
    var $node2 = $('.ct').eq(1);
    var carousel1 = new Carousel($node1);
    var carousel2 = new Carousel($node2);
    

    • 使用构造函数创建对象的方式实现 Tab 切换功能

    Object-tag-pages

    相关文章

      网友评论

          本文标题:对象、原型

          本文链接:https://www.haomeiwen.com/subject/yxuzettx.html