一、理解什么是对象:
任何东西都可以是对象,对象就是一组无序属性的集合 对象具有属性和方法
1.1 属性的类型
属性内部又定义了两种属性:数据属性和访问器属性

(1)数据属性:有4个描述的行为

Configurable 表示是否可以通过delate删除属性
Enumerable 表示是否可以通过for-in循环返回属性
Writable 表示是否修改属性的值
Value 表示这个属性的数据值

 

想要访问这些行为就需要用到Object.defineProtoperty()这个方法,参数是对象 属性名 {行为:值}
注意:如果一旦设置为false也就是不可配置之后,就不能配置成可配置的了(除了:writeable)虽然ie8能实现这个方法,但是实现不彻底(只能在DOM对象上使用,只能创建访问器属性),所以不要在ie8使用

(2)访问器属性

Configurable 是否通过delate删除
Enumerable 是否通过for-in循环
Get  读取属性调用的函数
Set 写入属性调用的函数

 

同样需要通过Object.definePrototype() 参数也是一样的 如果是get和set就是值需要写成函数。
这里有两个非标准的获取和写入属性的函数:_definefineGetter_()和_defineSetter_()这两个可以只用用对象.方法(‘属性’,functon(){return this.属性})

1.2、定义多个属性

Object.defineProperties() 参数:对象 {属性:{行为:值}}

1.3、获取属性的特性

利用上面两个方法设置好属性的特性之后,就可以用Obecjt.getOwnPropertyDescriptor()获取到属性的行为
Obecjt.getOwnPropertyDescriptor() 参数 对象 属性名,获取到的是这个属性的所有的行为的json类型

二、创建对象
2.1、工厂模式

function person(name,age){
var o=new Oject();
o.name=name;
o.age=age;
o.getname=function(){
alert(this.name)
}
return o;
}
var person1=person(1,2)

这里面是类似一个公共的函数,每次调用这个函数传入对应的值。这样省了每次都要写相同的代码  问题是:这样不能知道一个对象的类型

2.2、构造函数模式

function Person(name,age){
this.name=name;
this.age=age;
this.getname=function(){
alert(this.name)
}
}
var person1=new Person(1,2)

这里面new的作用是:1.一个新的对象 2.将this指向这个新的对象 3.给这个新的对象添加属性
constructor判断对象的都构造函数,instanceof判断对象的类型

问题:person1里面有个function function也是一个对象,在某种意义上来说每次new一个实例的的时候也是new了一个function,这样的话每个实例都有一个不同的function实例
解决:将this.getname=getname然后再构造函数外部写一个getname的函数,这样每个实例都指向的是全局的getname,问题:像上面这样解决,就会造成可能出现很多的全局函数

2.3、原型模式
理解原型 实例 构造函数的关系

原型:每个函数都有一个prototype属性,这个属性是一个指针,指向一个对象 就是原型对象
实例:就new 构造函数出来的,实例有一个内部的_proto_指针指向原型对象
注意:判断实例是否等于某个原型对象 用isPrototypeof这个方法Person.prototype.isPrototypePf(person1),获取某个对象的原型 Object.getPrototypeof()如果一个实例重写了一个属性的值,那么访问这个属性的时候,显示在实例找,没有的话,在找原型

判断属性存放在原型还是实例?
hasOwnProperty检测属性是否来自于实例,只有属性来自实例,才会返回true,in只要通过能够访问的属性就返回true,这两个结合可以确定属性是在原型还是在实例

2.4、组合会用构造函数和原型模式

function Person(name,age,job){
this.name=name;
this.age=age;
this.friends=[1,2]
}
Person.prototype={
constructor:Person,//放在原型对象是为了重写默认的prototype对象的时候,constructor属性变成新的对象的constructor属性,而指向Object函数
sayname:function(){
alert(this.name)
}
}
var person1=new Person(1,2)

三、继承
原型链:继承(原生链)

function Parent(name){
this.name=name;
}
Parent.prototype.sayname=function(){
alert(this.name)
}
function Child(name,job){
Parent.call(this,name);//将父级的属性继承,避免子级重写父级属性
this.job=job
}
Child.prototype=new Parent();//继承
Child.prototype.constructor=Child;
Child.prototype.sayjob=function(){
alert(this.job)
}

聊聊javascript中的面向对象的更多相关文章

  1. 前端开发:面向对象与javascript中的面向对象实现(二)构造函数与原型

    前端开发:面向对象与javascript中的面向对象实现(二)构造函数与原型 前言(题外话): 有人说拖延症是一个绝症,哎呀治不好了.先不说这是一个每个人都多多少少会有的,也不管它究竟对生活有多么大的 ...

  2. 简单分析JavaScript中的面向对象

    初学JavaScript的时候有人会认为JavaScript不是一门面向对象的语言,因为JS是没有类的概念的,但是这并不代表JavaScript没有对象的存在,而且JavaScript也提供了其它的方 ...

  3. 前端开发:面向对象与javascript中的面向对象实现(一)

    前端开发:面向对象与javascript中的面向对象实现(一) 前言: 人生在世,这找不到对象是万万不行的.咱们生活中,找不到对象要挨骂,代码里也一样.朋友问我说:“嘿,在干嘛呢......”,我:“ ...

  4. JavaScript从初见到热恋之深度讨论JavaScript中的面向对象。

    JavaScript中的面向对象.面向对象的三个基本特征:封装.继承.多态. 1.封装 js的封装如下 定义Person类 function Person(name,age,sex) { this.n ...

  5. 如何理解并学习javascript中的面向对象(OOP) [转]

    如果你想让你的javascript代码变得更加优美,性能更加卓越.或者,你想像jQuery的作者一样,写出属于自己优秀的类库(哪怕是基于 jquery的插件).那么,你请务必要学习javascript ...

  6. 前端开发:javascript中的面向对象

    前端开发:面向对象与javascript中的面向对象实现(一) 面向对象理解: 面向对象是一种对现实世界理解和抽象的方法,是一种先进的程序设计理念,是一种比较抽象的,多形态的设计模式.我们可以这么理解 ...

  7. 深入理解javascript中实现面向对象编程方法

    介绍Javascript中面向对象编程思想之前,需要对以下几个概念有了解: 1. 浅拷贝和深拷贝:程序在运行过程中使用的变量有在栈上的变量和在堆上的变量,在对象或者变量的赋值操作过程中,大多数情况先是 ...

  8. 直播开始:'云榨汁机'诞生记--聊聊JavaScript中的'业务建模'

    闭包是JavaScript中的一个重要特性,在之前的博文中,我们说闭包是一个'看似简单,其实很有内涵'的特性.当我们用JavaScript来实现相对复杂的业务建模时,我们可以如何利用'闭包'这个特性呢 ...

  9. JavaScript中的面向对象的讨论(转)

    前言 今天,WEB2.0时代的到来,给了JavaScript又一次大展身手的机会.Web2.0借助JavaScript技术,使得客户端的Web体验更加丰富多彩,同时JavaScript面对的问题域也变 ...

随机推荐

  1. OpenResty 安装及使用(第一篇安装)

    OpenResty搭建 1.openResty介绍 OpenResty (也称为 ngx_openresty)是一个全功能的 Web 应用服务器.它打包了标准的 Nginx 核心,很多的常用的第三方模 ...

  2. node.js之windows下环境终极配置

    大家都知道现在node.js相当流行,出门在外,如果都没听说过node.js,基本上算是out了,前段时间做一个项目,用到了实时通讯功能,当时用的就是node.js来做的,我有幸有研究了一番,别的不敢 ...

  3. 第三个Sprint冲刺第五天

    讨论地点:宿舍 讨论成员:邵家文.李新.朱浩龙.陈俊金 讨论问题:继续昨天的工作

  4. vb6 调用 64位应用程序

    Option Explicit Private Declare Function LoadLibrary Lib "kernel32.dll" Alias "LoadLi ...

  5. jsonpath

    1. java 类库 jayway/JsonPath maven 使用方法 <dependency> <groupId>com.jayway.jsonpath</grou ...

  6. .NET异常问题总结

    输入字符串的格式不正确. 有格式化字符替换符号{0}等,“{”和“}”作为特殊符号出现,如果有多余的“{”和“}”就会出错 GZIP压缩出现FF-F0-F1…是无效的输入流 要解压的字节流无效,可能是 ...

  7. 1、java中常用名字规范

    包名:多个单词组成是所有单词字母小写. 类名.接口名:所有单词首字母大写. 变量名.函数名:多单词组成时第一个单词首字母小写,从第二个单词开始首字母大写. 常量名:所有字母大写,单词之间用 “_” 连 ...

  8. Eclipse 配置Activiti插件

    Eclipse 配置Activiti插件 我使用的是Eclipse LUNA 4.4.0 点击Eclipse上方工具栏[Help]选择[Install New Software] 在弹出的窗口点击[A ...

  9. shell 判断条件

    [ -a FILE ] 如果 FILE 存在则为真. [ -b FILE ] 如果 FILE 存在且是一个块特殊文件则为真. [ -c FILE ] 如果 FILE 存在且是一个字特殊文件则为真. [ ...

  10. JSTL标签库中<c:choose></c:choose>不能放JSP页面<!-- -->注释

    笔者最近在使用JSTL标签库的<c:choose>标签时候,发现在该标签体中加了JSP的<!-- -->注释时,总是会显示报错信息.错误的信息如下: <span styl ...