码迷,mamicode.com
首页 > 编程语言 > 详细

JavaScript 面向对象

时间:2019-08-15 21:03:26      阅读:97      评论:0      收藏:0      [点我收藏+]

标签:有一个   类构造   对象   asc   混合   color   软件集   OLE   fun   

1. 什么是对象?

       对象object 是一些相关的变量和方法的软件集。

       特性: 属性和方法

       JavaScript中的所有事物都是对象。

       创建对象的方法:

  1. 字面量
  2. new Object()  创建
  3. 自定义构造函数
  4. Object.create() 创建
  5. 工厂函数
var obj = new Object();
// obj是对象,Object是类
// 对象是类的实例和具体,类是对象的集合

         建立一个工厂函数

function createStudent(name,age,ClassName){
            var obj = new Object();
            obj.name = name;
            obj.age = age;
            obj.ClassName = ClassName;
            obj.study = function(){
                console.log("学习Css");
            }
            return obj;
        }
        var ming=  createStudent("明",20,"1811");
        var hong=  createStudent("红",21,"1811");
// 可以很好减少代码量

 

2.什么是面向对象?

        面向对象是一个思想,就是把解决问题的注意力集中到对象上。

        面向对象的三大特点:封装 继承 多态。    

        封装:把所有相关的属性和方法封装在一个对象里。
        继承:自己没有的属性或者方法,可以把别的拿过来用
        多态:不同的对象根据事件情况,执行代码不同。js可以模拟实现。

3.常用的内置对象(构造函数)

Number String Boolean
Array Date Math RegExp
Function Object
Global Error

        构造函数: new  后面就是构造函数,构造函数中的this就是指向当前对象。

var arr = new Array();
// arr 是对象,Array 是类。 对象是由类所构造的。
// Array() 是构造函数

       把工厂函数变换成构造函数

function createStudent(name,age,ClassName){
            this.name = name;
            this.age = age;
            this.ClassName = ClassName;
            this.study = function(){
                console.log("学习Css");
            }
            return obj;
        }

        var ming= new createStudent("明",20,"1811");
        var hong= new createStudent("红",21,"1811");

         ming.study();
         hong.study();

         // ming 是对象  createStudent是类  createStudent是构造函数
         // 类的本质还是函数
        

 

4.原型对象

         js就是基于原型的对象。

function Person(){

}
var xiaoming = new Person();
//1. 每个类(函数) 天生有一个prototype 的属性,创建了一个对象,而这个对象的就是这个函数的原型,这个对象里有个constructor(构造函数) 的属性,属性值是类本身。
//2. 我们所有new 一个类的时候,其实是调用它的构造函数。构造函数里的属性都是私有的,构造函数里的this都是实例对象。
//3. 每个对象上天生有一个__proto__ ,指向类的原型。

 

5.原型链

          原型链: 由各级对象的__proto__逐级继承形成的关系。

          原型链的作用也是节省空间。

          __proto__和prototype:

                 1.  prototype 是类的或者函数的, __proto__ 是对象的。
                 2.  __proto__是查找机制 ,prototype是存储机制。

function Person(name,age){  
        this.name= name;
}

 var zhang = new Person("zhang");
 console.log(zhang.name);  //zhang
 console.log(zhang.age);  //undefined

//当zhang 查找某个属性时(比如:name):
//zhang 这个对象首先看name 是私有的,是就直接使用,不是的就通过 __proto__ 往它的 //类的prototype 上查找,有就直接使用,没有就继续向上查找,直到查找到基类object ,没有 //就是undefined  ,有就直接使用。这种查找机制 叫原型链。

// 所以zhang.name 返回的是zhang,而zhang.age 返回undefined

 

6.继承

         

// 父类
function Person(name){
     this.name = name;
     this.eat= function(){
      console.log("chi");
}
}
Person.prototype.age = 10; // 添加原型属性

         1. 原型继承

function Son(){
      this.age = 23;
}
var p1 = new Person("zhang");
Son.prototype = p1;
var s1 = new Son;
console.dir(s1.name); // zhang

// 将父类的实例赋值给子类的原型:私有的公有的都继承为共有的。

 

       2. call继承 (call方法是函数/类天生自带的一个方法。);

       

function Son(){
      this.age = 23;
      Person.call(this,"123"8);
}
var p1 = new Person("zhang");
var s1 = new Son;
console.log(s1.age); // 23
console.log(s1.name); // 123

//只继承了父类构造函数的属性,没有继承父类原型的属性。

        3. 冒充对象继承

var p1 = new Person("zhang");

for(var key in p1){
        console.log(key); //name in 
}

// 将父类私有的和公有的都继承为子类私有的 使用for in
// for in 可以遍历对象的共有属性fn就是公有的

 

        4. 混合继承  (call 继承和原型继承的结合)

// 父类
function Person(name){
     this.name = name;
}
Person.prototype.age = 10; // 添加原型属性

var p1 = new Person;
function Son() {
   Person.call(this); // 私有的继承为私有的了
}
Son.prototype=p1;
var s1 = new Son;
console.log(s1); // zhang

// 私有的继承为私有的 私有的和公有的再次继承为公有的。

 

         5. 组合继承

         

         // 父类
        function Person(){   
            this.name ="zhang";
        }
        Person.prototype.fn=function(){
            console.log(111);
        }
        var p = new Person;

         // 子类
        function Son(){
            Person.call(this);
        }
        Son.prototype=Object.create(Person.prototype);
        var s = new Son;
        s.__proto__.fn=function(){
            console.log(222);
        }
        s.fn(); //222
        p.fn(); //111

          6.  中间类继承

           

function fn(a,b,c){
            arguments.__proto__ = Array.prototype;
            arguments.push(89);
            console.log(arguments);
}
fn(45,56,23); //45,56,23,89

JavaScript 面向对象

标签:有一个   类构造   对象   asc   混合   color   软件集   OLE   fun   

原文地址:https://www.cnblogs.com/qirui-/p/11360278.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!