zoukankan      html  css  js  c++  java
  • JavaScript 面向对象编程

    写的项目需要把js封装处理,不然很乱。。然后就想到前端大神阮一峰了,去blog搜索一下果然有收获

    参考文章:

    Javascript定义类(class)的三种方法

    Javascript 面向对象编程(一):封装

    此处使用极简主义法:

    如何定义一个类:

    此法是定义一个生成器以及构造函数(类似工厂模式吧)

    var Cat = {

        createNew: function(){

        var cat = {};

        cat.name = "大毛";

        cat.makeSound = function(){ alert("喵喵喵"); };

        return cat;

      }

    };

    Cat是生成器类,createNew是一个构造器函数,cat是实体对象,cat.name是成员变量

    如何调用构造器:

    var cat1 = Cat.createNew();
    cat1.makeSound(); // 喵喵喵

    如何定义私有变量:

    cat.name是一个公有变量,外部可以直接访问

    定义私有变量的方法则是在构造函数里定义一个局部变量,这样只有类的成员函数能够访问这个变量了,外部访问是undefined

    var Cat = {
        createNew: function(){
        var cat = {};
        var sound = "喵喵喵";
        cat.makeSound = function(){ alert(sound); };

        var privateFun() {alert("private")}
        cat.publicFun() {
          privateFun(); //注意这里不能用this.privateFun();,会报错
          alert("public");
        }
        
    return cat;   } };

    测试结果

    var test = Cat.createNew();
    test.privateFun(); // undefined
    test.publicFun(); // "private" "public"

    如何定义静态变量(数据共享):

    在Cat这个构造类内定义变量。。这就涉及到闭包的知识了,Cat类只存在一个实力,而cat1=Cat.createNew(),实际上是在Cat类的一个子函数定义一个变量,子函数是可以访问父类/父函数内的变量的,所以无论那个实体类修改Cat的成员变量的时候,Cat这个类里的变量就修改了,就实现了相当于Java的静态变量的功能了

    var Cat = {
        sound : "喵喵喵",
        createNew: function(){
        var cat = {};
        cat.makeSound = function(){ alert(Cat.sound); };
        cat.changeSound = function(x){ Cat.sound = x; };
        return cat;
      }
    };

    这样sound就是一个静态变量

    然后生成两个实例对象并用其中一个修改sound

    var cat1 = Cat.createNew();
    var cat2 = Cat.createNew();
    cat1.makeSound(); // 喵喵喵
    
    cat2.changeSound("啦啦啦");
    cat1.makeSound(); // 啦啦啦

    cat2.changeSound("啦啦啦");

      cat1.makeSound(); // 啦啦啦

  • 相关阅读:
    leetcode701. Insert into a Binary Search Tree
    leetcode 958. Check Completeness of a Binary Tree 判断是否是完全二叉树 、222. Count Complete Tree Nodes
    leetcode 110. Balanced Binary Tree
    leetcode 104. Maximum Depth of Binary Tree 111. Minimum Depth of Binary Tree
    二叉树
    leetcode 124. Binary Tree Maximum Path Sum 、543. Diameter of Binary Tree(直径)
    5. Longest Palindromic Substring
    128. Longest Consecutive Sequence
    Mac OS下Android Studio的Java not found问题,androidfound
    安卓 AsyncHttpClient
  • 原文地址:https://www.cnblogs.com/someblue/p/4330770.html
Copyright © 2011-2022 走看看