js 面向对象讲解

1.面向对象概念

  1)什么是面向对象:  oop    是一种编程的思想, 体现的是生活逻辑

2) 面向对象和面向过程:

面向过程:

1:大量的全局变量
        2:命名冲突
        3:顺序执行(一步一步一步........)

面向对象三大特性:封装  继承  多态(js没有多态的)

             js:  封装\抽象\继承(借)

3) 写js面向对象代码特点:
            高内聚(在一个功能模块里面所有的代码必须紧密相邻)
            低耦合(模块和模块之间尽量 少 关联)

2.构造函数

构造函数- >   new 对象(实例化对象) ->   存储数据。

注:构造函数(为了区分普通函数和构造函数  构造函数的首字母大写)

构造函数  ->  去实例化对象.

eg:写一个对象去描述一个人
        var person = new Object();
        person.name = ‘wangshuai‘;
        person.age = ‘20‘;
        person.show = function(){
            return ‘好帅‘
        }

去描述100个人(复制?????)   封装起来
            function person(name,age){
                var obj = new Object();         //工厂
                obj.name = name;               //加工
                obj.age = age;
                obj.show = function(){
                    return obj.name;
                }
                return obj;                     //出厂
            }
            var person1 = person(‘wangshuai‘,‘20‘);
            var person2 = person(‘xiaom‘,‘10‘);
            var person3 = person(‘ee‘,‘30‘);
       
            上述代码分析:
                在创建每一个人的时候(调用person),在函数内部每次都会new 一个对象          
            在构造函数里面  实例化对象的时候。 自动return 出一个this   指向当前这个对象。

  3:普通函数 和构造函数的差别:

例:          

function person(){    
        return this;
    }

var p1 = new person();    //实例化对象     person构造函数。
    console.log(p1)

普通函数如果函数内部没有return的时候,返回的是一个undefined.
        构造函数如果内部没有return的时候,再实例化的对象的时候(new 对象),自动return出 this 指向当前构造出来的这个对象

        

4. prototype      
        原型对象:
            记录了一个函数公共的属性和方法。
            可以拓展属性和方法
            节约内存提升性能
            继承属性和方法

例: function Person(name,age){
        this.name = name;
        this.age = age;
    }
    Person.prototype.show = function(){
        this.name;
    }
    var p1 = new Person(‘ws‘,10);
    var p2 = new Person(‘dd‘,20);
    console.log(p1.show == p2.show)

原文地址:https://www.cnblogs.com/wangwenxin123/p/10865460.html

时间: 2024-10-11 15:14:38

js 面向对象讲解的相关文章

面向对象JS基础讲解,工厂模式、构造函数模式、原型模式、混合模式、动态原型模式

什么是面向对象?面向对象是一种思想!(废话). 面向对象可以把程序中的关键模块都视为对象,而模块拥有属性及方法.这样我们如果把一些属性及方法封装起来,日后使用将非常方便,也可以避免繁琐重复的工作.接下来将为大家讲解在JS中面向对象的实现. 工厂模式 工厂模式是软件工程领域一种广为人知的设计模式,而由于在ECMAScript中无法创建类,因此用函数封装以特定接口创建对象.其实现方法非常简单,也就是在函数内创建一个对象,给对象赋予属性及方法再将对象返回即可. function createBlog(

js面向对象的系列

在面向对象语言中如java,C#如何定义一个对象,通常是定义一个类,然后在类中定义属性,然后通过new 关键字来实例化这个类,我们知道面向对象有三个特点,继承.多态和封装.那么问题来了,在javaScript中如何定义一个类?在javaScript中如何定义类的属性?如何继承?带着这些问题开始我们的js面向对象之旅吧. 在js中如何定义类? js中是没有类的概念的,但是我们通常会用一个函数定义成一个类.funtion class1(){ //类的成员定义 } 这里class1既是一个函数也是一个

简单粗暴地理解js原型链--js面向对象编程

简单粗暴地理解js原型链--js面向对象编程 原型链理解起来有点绕了,网上资料也是很多,每次晚上睡不着的时候总喜欢在网上找点原型链和闭包的文章看,效果极好. 不要纠结于那一堆术语了,那除了让你脑筋拧成麻花,真的不能帮你什么.简单粗暴点看原型链吧,想点与代码无关的事,比如人.妖以及人妖. 1)人是人他妈生的,妖是妖他妈生的.人和妖都是对象实例,而人他妈和妖他妈就是原型.原型也是对象,叫原型对象. 2)人他妈和人他爸啪啪啪能生出一堆人宝宝.妖他妈和妖他爸啪啪啪能生出一堆妖宝宝,啪啪啪就是构造函数,俗

js面向对象程序设置——创建对象

<script type="text/javascript">            //工厂方式        //1.原始方式        /* var objCar=new Object();        objCar.name="劳斯莱斯";        objCar.color="blue";        objCar.showColor = function() {          alert(this.colo

js面向对象编程:如何实现方法重载

js中如何实现方法重载?这涉及到三个问题 1同名函数的调用问题 2函数中特殊的参数arguments 3如何利用arguments实现方法重载 1同名函数的调用问题 都知道在js中如果存在多个名称相同的函数,则调用实际每次都只使用最后一个,js其实是没有重载的,也就是说,如果定义了多个同名的函数,单参数不一样,在调用时,js不管参数个数,只管前后顺序 例如: function test1(arg1) { alert("参数1:"+arg1); } function test1(arg1

js面向对象编程:如何定义常量?

js中有一个关键字const,但目前的浏览器似乎还不支持,如果一定要定义一些常量,其实可以使用闭包,匿名函数实现常量的定义. 例如: var Class = (function() { var UPPER_BOUND = 100;//定义了常量 var Test={}; // 定义了一个静态方法 获取常量的方法 Test.getUPPER_BOUND=function() { return UPPER_BOUND; } return Test; })(); 用法: var k=Class.get

JS面向对象(3) -- Object类,静态属性,闭包,私有属性, call和apply的使用,继承的三种实现方法

相关链接: JS面向对象(1) -- 简介,入门,系统常用类,自定义类,constructor,typeof,instanceof,对象在内存中的表现形式 JS面向对象(2) -- this的使用,对象之间的赋值,for...in语句,delete使用,成员方法,json对象的使用,prototype的使用,原型继承与原型链 JS面向对象(3) -- Object类,静态属性,闭包,私有属性, call和apply的使用,继承的三种实现方法 1.Object类 在JS中,Object是所有类的基

js面向对象深入理解

js面向对象深入理解 ECMAScript 有两种开发模式:1.函数式(过程化),2.面向对象(OOP).面向对象的语言有一个标志,那就是类的概念,而通过类可以创建任意多个具有相同属性和方法的对象.但是,ECMAScript 没有类的概念,因此它的对象也与基于类的语言中的对象有所不同. 一.创建对象 创建一个对象,然后给这个对象新建属性和方法. var box = new Object(); //创建一个Object 对象 box.name = 'Lee'; //创建一个name 属性并赋值 b

js面向对象编程

1.js面向对象之对象 1.1js代码 <script> function hello(){ alert("hi!"); } //使用prototype属性为类添加属性和方法 hello.prototype={ name:"lihua", say:function(){ alert(this.name); } } //测试 function test(){ var people=new hello(); people.say(); alert(peopl