哈哈哈万物皆对象,终于到了js的面向对象篇。

一、属性类型

(1)数据属性

数据属性包含一个数据值的位置,在这个位置可以写入和读取数值,数据属性有四个描述器行为的特性

  • [[Configurable]]:表示能否通过 delete 删除属性而重新定义属性,默认值是ture
  • [[Enumerable]]:表示能否通过 for-in 循环返回该属性,默认值true
  • [[Writable]]:表示能否通过修改属性的值,默认值true
  • [[Value]]:包含这个属性的数据值,默认值true

要修改默认属性的特性,必须使用ECMAScript的Objedt.defineProperty()方法,这个方法接受三个参数:函数所在对象、属性名字和一个描述对象。例

 var person = {};
Object.defineProperty(person,"name".{
writable:false,
value:"Nicholas"
});
alert(person.name); //Nicholas
person.name = "Greg";
alert(person.name); //Nicholas

(2)访问器属性

访问器属性包括一对getter和setter函数,在读取访问器属性时,会调用getter函数,这个函数负责返回有效值,写入访问器属性的时候,会调用setter函数并传入新值,这个函数决定如何处理数值,访问器属性有如下4个特性

  • [[Configurable]]:能否通过delete删除属性并进行重新定义,默认值时true
  • [[Enumerable]]:表示能否通过for-in循环返回属性,默认值时true
  • [[Get]]:在读取属性时调用的函数,默认值true
  • [[Set]]:在写入属性时调用的函数,默认值true

访问器属性不能直接定义必须使用Obiect.defineProperty()来定义,例

var book = {
_year: 2004,
edition: 1
};
Object.defineProperty(book,"year", {
get: function(){
return: this._year;
},
set: function(newValue){
if(newValue > 2004){
this._year = newValue;
this.edition += newValue - 2004
}
}
});
var year = 2005;
alert(book.edition); //2

二 创建对象

(1)工厂模式

    function createPerson(name, age, job){
var o = new Object()
o.name = name
o.age = age
o.job = job
o.sayName = function(){
alert(this.name)
}
return o
}
var person = createPerson("Greag", 29, "Software Engineer")
person.sayName()

每次调用这个createPerson()都能返回一个三个属性一个方法的,工厂模式虽然解决了多个相似对象的问题,但却没有解决对象识别的问题,于是新的模式就出现了

(2)构造函数模式

    function Person(name,age,job){
this.name = name;
this.age = age;
this.job = job;
this.sayName = function(){
alert(this.name)
}
}
    var person = new Person("Nic", 22, "Software Engineer")
person.sayName()
 

构造函数虽然好用但并不是没有缺点,就是每个方法都要在实例上创建一遍,因为每定义了一个函数就相当于实例化了一个对象,所以构造函数的定义相当与



function Person(name,age,job){
this.name = name;
this.age = age;
this.job = job;
this.sayName =new Function(
"alert(this.name)"

) // 与声明函数在逻辑上是相等的

}
var person1 = new Person("Greg", 22, "Doctor");
var person2 = new Person("Nic", 22, "Software Engineer");

这样就会导致不同的实例上的同名函数是不同的 alert( person1.sayName == person2.sayName)     //false  创建两个完成相同任务的Function完全没有必要,于是又出现了原型模式

(3)原型模式

我们每创建一个函数都会有一个property(原型)属性,这个属性是一个指针,指向一个对象,而这个对象的用途就是包含可以由特定的类型的所有实例共享的属性和方法,也就是我们不必在构造函数中添加对象的信息,可以直接添加到原型对象上,

    //原型模式
function Person(){}
Person.prototype.name = "Nic"
Person.prototype.age = 22
Person.prototype.sayName = function(){
alert(this.name)
}
var person1 = new Person();
var person2 = new Person();
alert(person1.sayName == person2.sayName) //true

简洁的原型语法

    //简洁的原型语法
function Person(){}
Person.prototype = {
name:"Nic",
age:22,
sayName:function(){
alert(this.name)
}
}

原型模式也不是没有缺点,首先他省略了为构造函数传递初始化参数这一环节,结果所有实例在相同的情况下都取得相同的属性值,原型模式最大的问题就是其共享的本质所导致,对于包含引用属性的来说,问题就很突出。例

function Person(){};
Person.prototype = {
constructor: Person,
name: "nic",
age: 23,
friends: ["Court", "shelby"]
}
var person1 = new Person();
var person2 = new Person();
person1.friends.push("Van")
alert(person1.friends) //Court, shelby, Van
alert(person2.friends) //Court, shelby, Van
alert(person1.friends === person2.friends) //true

我们的初衷往往不是这样,这也是我们很少看见有人直接用原型模式的原因。

(4)组合使用构造函数和原型模式

创建自定义类型最常见的方式就是组合使用构造函数模式和原型模式,构造函数定义实例属性,原型模式定义方法和共享属性,例

    //组合构造函数模式和原型模式
function Person(name, age, job){
this.name = name,
this.age = age,
this.job = job,
this.friends = ["Court", "Shelby"]
}
Person.prototype = {
constructor: Person,
sayName: function(){
alert(this.name)
}
}
var person1 = new Person("Nic", 23, "Software Engineer")
var person2 = new Person("Greg", 22, "Doctor")
person1.friends.push("Van")
alert(person1.friends) //"Court", "Shelby", "Van"
alert(person2.friends) //"Court", "Shelby"
alert(person1.friends === person2.friends) //false
alert(person1.sayName === person2.sayName) //true

Javascript高级程序设计--读书笔记之面向对象(一)的更多相关文章

  1. Javascript高级程序设计--读书笔记之面向对象(二)

    前面讲了面向对象的封装,这章我们就来说一说继承 1.原型链 实现原型链有一种基本模式,其代码大概如下 <script> function SuperType(){ this.propert ...

  2. javascript高级程序设计读书笔记-事件(一)

    读书笔记,写的很乱   事件处理程序   事件处理程序分为三种: 1.html事件2. DOM0级,3,DOM2级别  没有DOM1 同样的事件 DOM0会顶掉html事件   因为他们都是属性  而 ...

  3. javascript高级程序设计读书笔记----面向对象的程序设计

        创建对象   工厂模式 function createPerson(name, age, job){ var o = new Object(); o.name = name; o.age = ...

  4. javascript高级程序设计读书笔记

    第2章  在html中使用javascript 一般都会把js引用文件放在</body>前面,而不是放在<head>里, 目的是最后读取js文件以提高网页载入速度. 引用js文 ...

  5. Javascript高级程序设计读书笔记(第六章)

    第6章  面向对象的程序设计 6.2 创建对象 创建某个类的实例,必须使用new操作符调用构造函数会经历以下四个步骤: 创建一个新对象: 将构造函数的作用域赋给新对象: 执行构造函数中的代码: 返回新 ...

  6. 《JavaScript高级程序设计》笔记:面向对象的程序设计(六)

    面向对象的语言有一个标志,那就是它们都有类的概念,而通过类可以创建任意多个具有相同属性和方法的对象. 理解对象 创建自定义对象的最简单的方法就是创建一个Object的实例,然后再为它添加属性和方法.例 ...

  7. JavaScript高级程序设计 读书笔记

    第一章 JavaScript 简介 第二章 Html中使用JavaScript 第三章 基本概念 第四章 变量,作用域,内存 第五章 引用类型 第六章 面向对象 第七章 函数表达式 第八章 BOM 第 ...

  8. JavaScript高级程序设计-读书笔记(7)

    第22章 高级技巧 1.高级函数 (1)安全的类型检测 在任何值上调用Object原生的toString()方法,都会返回一个[object NativeConstructorName]格式的字符串. ...

  9. JavaScript高级程序设计-读书笔记(2)

    第6章 面向对象的程序设计 创建对象 1.最简单方式创建Object的实例,如 var person = new Object(); person.name = “Greg”; person.age ...

随机推荐

  1. docker--container的port映射

    使用nginx为例 先运行nginx [root@localhost ~]# docker run --name web -d nginx Unable to find image 'nginx:la ...

  2. 《零基础学习Python制作ArcGIS自定义工具》课程简介

    Python for ArcGIS Python for ArcGIS是借助Python语言实现ArcGIS自动化行为的综合,它不止是如课程标题所述的“制作ArcGIS自定义工具”,还包括使用Pyth ...

  3. MVC通过重写OnActionExecuting获取控制器,方法和域

    一,如下代码 protected override void OnActionExecuting(ActionExecutingContext filterContext) {string _cont ...

  4. kvm的img文件的本机挂载

    非lvm分区挂载方法: mount -o loop xxx.img /mnt/xxx 系统提示: “mount: you must specify the filesystem type” 执行:fd ...

  5. 利用Python语言Appium启动ios app

    首先配置好电脑环境,主要是appium太难配了,不多说 然后,分两步 第一步:启动appium服务器 有三种方法,1.下载appium-desk-top(桌面客户端),启动 2.终端启动:appium ...

  6. 工具类Collections、Arrays(传入的是数组)

    Collections类: 1. Collections.sort(list)   //对list集合进行排序前提是 list里面存储的对象已经实现了 comparable接口 2. Collecti ...

  7. java基础学习笔记二(接口、super、this)

    一.super 和 this的用法 主要解释一下引用构造函数的用法 super(参数):调用父类中的某一个构造函数(应该为构造函数中的第一条语句) this(参数):调用本类中另一种形式的构造函数(应 ...

  8. SQO2008配置管理工具服务显示远程过程调用失败0x800706be

    需要进行删除或更改程序里面,去卸载Microsoft SQL Server 2012 Express LocalDB就可以用了 如果还不可以看,看看是不是还有其它的占用了这个实例名 如: Micros ...

  9. Druid数据源配置入门

    Druid是什么 Druid首先是一个数据库连接池.Druid是目前最好的数据库连接池,在功能.性能.扩展性方面,都超过其他数据库连接池,包括DBCP.C3P0.BoneCP.Proxool.JBos ...

  10. Java虚拟机解析篇之---垃圾回收器

    上一篇说了虚拟机的内存模型,在说到堆内存的时候我们提到了,堆内存是Java内存中区域最大的一部分,而且垃圾回收器主要就是回收这部分的内容.那么这篇就来介绍一下垃圾回收器的原理以及回收的算法. Java ...