js面向对象总结

JS面向对象--创建对象

1.对象的创建及常用的操作

第一种是使用new运算符

例子:var obj = object();
     obj.name = "puyao";
     obj.age = 20;
     obj.address = "四川成都";
第二种是我们常用的字面量

例子:var obj ={
        name ="puyao";
        age = 20;
        address = "四川成都"; 
      };
第三种是简单方式(传统赋值方式)

例子:var obj ={};
     obj.name = "puyao";
     obj.age = 20;
     obj.address = "四川成都";
2.属性的调用

调用的方法:

alert(obj.name + " " +obj.age);//返回“puyao 20”
另一种调用方法:

alert(obj[‘name‘] + " " +obj[‘age‘]);

3.创建对象

例子: var obj = new object();
      obj.name = "puyao";
      obj.age = 20;
      obj.name = "四川成都";

像这样创建一个对象时比较直观的,也是javascript创建对象的基本方法。但是如果要创建
多个对象的时候,像这样的要写很多个,比较麻烦,所以我们用到工厂模式这种方法。

工厂模式的例子:

function createObj(name,age){

var obj = new object();

obj.name = name;

obj.age = age;

obj.name = address;

obj.show = function(){

return this.name + " " + this.age;     
 
};
      return obj;

}

var obj1 = ("puyao1",20);
   var obj2 = ("puyao2",22);
   alert(obj1.show());
   alert(obj2.show());
 
这个工厂模式方法解决了创建多个对象的难题,但是还是存在一个重要问题,那就是对象识别。以上的代码
根本弄不清楚到底哪个是哪个创建,所以我们就必须用到构造函数的方法来识别。

4.构造函数(构造方法)

例子:  function user(name,age){
         this.name = name;
         this.age = age;
         this.show = function(){
          return this.name + " " +this.age;
 
       };

}
创建对象的时候用new运算符就可以了

var user1 = new user("puyao1",20);//第一实例
var user2 = new user("puyao2",22);//第二实例

我们可以用instanceof来检验user1或者user2是不是属于user
alert(user1 instanceof user);//true

要创建user对象的新实例,就要用到new操作符,使用这个方法构建实例对象,会经过下面4个步骤

(1)创建一个新对象;

(2)讲构造函数的作用域给新对象(因此this指向这个新对象);

(3)执行构造函数内的代码(在为新对象添加属性);

(4)返回新对象。

还要注意以下的问题

1.构造函数也是函数
区别:构造函数与函数的唯一区别,就是调用方式不同,不过构造函数也是函数,不存在什么特殊的定义构造函数的语法。
任何函数,只要通过new操作符来调用,就可以把它看作函数,而任何函数,如果不通过new操作符调用,它就与普通函数
没有什么区别,例如上面定义的obj.

//当作构造函数调用

var user1 = new user("puyao",20);
user1.show();//puyao 20;

//当作普通函数调用

user("puyao",20);
window.show();//puyao 20;

上面代码显示的结果没有什么区别,只是当作普通函数调用的话,函数里this对象的指向,就是指向window全局对象
而通过new关键字调用,this指向的只是新对象而已。

时间: 2024-11-03 07:50:32

js面向对象总结的相关文章

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

js面向对象编程:两个小括号的使用

在查看很多jQuery的过程中,经常遇到两个小括号的情况. 例如: (function() { alert("测试1"); })(); (function() { alert("测试3"); }()); 其实这段代码,就是定义了一个匿名函数,并且进行了调用, 相当于如下几行代码: (function ListCommon2() { alert("测试1"); })(); (function ListCommon3() { alert("

js面向对象编程:this到底代表什么?

在js中this的用法很让人迷惑,有些像Java或者C#中的this,但又不完全一样.按照流行的说法this总是指向调用方法的对象. 1.纯粹函数调用. function ListCommon2(x) { this.x=x; alert("this 是 ListCommon2"+(this instanceof ListCommon2)); alert("this.constructor"+this.constructor); } function test(){