zoukankan      html  css  js  c++  java
  • 面向对象编程——封装

    面向对象编程——封装

    javascript有两种编程风格:面向过程和面向对象
    所谓的面向对象就是将你的需求抽象成一个对象然后针对这个对象分析其属性和方法,这个对象我们称之为类,他的一个特点就是封装。

    封装

    • 创建一个类

        var Book = function(id, bookname, price){
        	this.id = id;
        	this.bookname = bookname;
        	this.price = price;
        }
      
        var book = new Book(10, 'javascript模式设计', 50);
        console.log(book.bookname);
      

    通过this添加的属性和方法同在prototype中添加的属性和方法的区别:通过this添加的属性和方法是在当前对象上添加的,然而javascript是基于prototype上的语言是,所以没创建一个对象时,他都有一个原型prototype用于指向其继承的属性和方法。这样,通过prototype继承的方法并不是对象自身,所以在使用这些方法时,需要通过prototype一级一级的查找的到。因此,通过this定义的属性或方法是对象自身拥有的,所以我们每次通过类创建一个新对象时,this指向的属性和方法都会得到相应的创建,而通过prototype继承的属性和方法是每个对象通过prototype访问到的,所以不在创建。

    • 属性和方法的封装

         var Book = function(id, name, price){
            	//私有属性
            	var num = 1;
            	//私有方法
                function checkId(){
      
         };
            //特权方法
            this.getName = function(){};
            this.getPrice = function(){};
            this.setName = function(){};
            this.setPrice = function(){};
            //对象的贡藕属性
            this.id = id;
            //构造器
            this.setName(name);
        }
        
        //类静态共有属性(对象不能访问)
        Book.isChinese = true;
        //类静态共有方法(对象不能访问)
        Book.resetTime = function(){
        	console.log('new tiem')
        };
        Book.prototype = {
        	//共有
        	isJSBook: false,
        	display: function(){}
        }
      
        var b = new Book(11, 'javascript模式设计', 50);
        console.log(b.num);//undefined
        console.log(b.isJSBook);//false
        console.log(b.id);//11
        console.log(b.isChinese);//undefined
      
        console.log(Book.isChinese);//true
        Book.resetTime();//new tiem
      

    由于javascript的函数级作用域,声明在函数内部的变量和方法在外界是访问不到的,通过此特性,可创建类的私有变量和方法。然而在函数内部通过this创建的属性和方法,在类创建对象时,每个对象都拥有一份并且可以在外部访问到。因此通过this创建的属性可以看作共有属性和方法。
    通过new关键词创建的对象实质上是对新对象this的不断赋值。

    • 闭包实现类的静态变量

        var Book = (function(){
        	//静态私有变量
        	var booknum = 0;
        	//方法
        	function checkBook(name){
      
        	}
        	//返回构造函数
        	return function(newId, newName, newPrice){
        		//私有变量
        		var name,price;
        		//方法
        		function checkId(id){}
        		//特权方法
                this.getName = function(){};
                this.getPrice = function(){};
                this.setName = function(){};
                this.setPrice = function(){};
                //公有属性
                this.id = newId;
                //公有方法
                this.copy = function(){};
                booknum++
                if(booknum > 100){
                	throw new Error("我们仅出版100本书");
                }
                //构造器
                this.setName(name);
                this.setName(price);
            }
        })();
      
        Book.prototype = {
        	//共有
        	isJSBook: false,
        	display: function(){}
        };
      
        var b = new Book(11, 'javascript模式设计', 50);
        console.log(b.num);
        console.log(b.isJSBook);
        console.log(b.id);
      

      闭包是有权限访问另一个函数作用域中变量的函数,即在一个函数内部创建另一个函数。我们将这个闭包作为创建对象的构造函数,这样它即是闭包又可实例对象的函数,可以访问到类函数作用域中的变量。

    • 创建对象的安全模式
      对于初学者来说,经常容易忘记使用new而犯错误。如:

        var Book = function(title, time, type){
        	this.title = title;
        	this.time = time;
        	this.type = type;
        }
        var book = Book('javascript模式设计', '2014', 'js');
        console.log(book);//undefined
        console.log(window.title);//javascript模式设计
      

    new关键词的作用可以看成是对当前对象的this不停的赋值,但是这里没有new,所以就会直接执行这个函数,而这个函数在全局作用域中执行了,所以在全局作用域中this就是全局变量,在页面里面全局变量就是window。
    为了避免这样的错误,我们就可以给他设计一个安全模式:

        var Book = function(title, time, type){
        	//判断执行过程中this是否是当前对象
        	if(this instanceof Book){
                this.title = title;
            	this.time = time;
            	this.type = type;
        	}else{
        		return new Book(title, time, type);
        	}
        	 
        }
        var book = Book('javascript模式设计', '2014', 'js');
        console.log(book);//Book
        console.log(window.title);//undefined
    

    这样就不用再担心忘记new关键词的问题了。

  • 相关阅读:
    [团队项目] Scrum 项目 3.0 SCRUM 流程的步骤2: Spring 计划
    《构建之法》第6-7章读后感
    【操作系统】实验二 作业调度模拟程序
    团队项目2.0软件改进分析MathAPP
    团队项目
    结对编程2.0
    电影(网剧))项目
    实验0 了解和熟悉操作系统
    复利计算
    学习进度条
  • 原文地址:https://www.cnblogs.com/yehui-mmd/p/6485030.html
Copyright © 2011-2022 走看看