1.对象中包含什么

在javascript中,从函数到字符串实际上都是对象

  • 继承
//创建一个person对象的实例
var penson={};
person.getName=function(){...};
person.getAge=function(){...}; //创建一个emloyee对象的实例
var employee={};
employee.getTitle=function(){...};
employ.getSalary=function(){...}; //从person对象中继承方法
employee.getName=person.getName;
employee.getAge=person.getAge;
  • 理解对象成员
ADS.addEvent(window,'load', function() {
alert('document.body is a: ' + document.body);
});//document.body is a:object HTMLBodyElement ADS.addEvent(window,'load',function() {
alert('document.getElementById is a: ' + document.getElementById);
});
//document.getElementById is a:
//function getElementById(){[native code]}
  • window对象中的一切(覆盖作用域链中的对象)
<h1>Override the alert() method</h1>
<p>Interesting isn't it?</p>

function override() {
// 覆盖alert函数
var alert = function(message) {
window.alert('overridden:' + message);
};
alert('alert'); // 在override()函数的作用域中调用原始的alert()函数
window.alert('window.alert');
}
override(); // 在window的作用域中调用原始的alert();
alert('alert from outside');
//弹出顺序:
//overridden:alert
//window.alert
//alert from outside
  • 理解作用域和闭包是根本

2.创建你自己的对象

var myObject=new Object();//Object是一个对象
var myObject={};
//这两种都已经被实例化。实例化的对象一定是一个构造函数
//创建一个数组
var myArray=new Array();
var anotherObject=new myObject();//错误的
  • 一变多:创建构造函数
function myConstructor(a){
//somecode
}
var myConstructor=function(a){
//comecode
}
var myConstructor=new function('a','/*somecode*/')//性能有问题
//使用
var myObject=new myConstructor();
//再比如:
function myConstructor(message)
{
alert(message);
this.myMessage=message;
}
var myObject=new myConstructor('Instantiating myObject');
var message=myObject.myMessage;
  • 添加静态方法
//了解实例与构造函数之间的区别有助于消除许多已有的问题
//-------仅对Object能正常运行
//创建一个Object对象实例
var myObject=new Object();
//添加一个属性
myObject.name='Jeff';
//添加一个方法
myObject.alertName=function()
{
alert(this.name);
}
//执行添加的方法
myObject.alertName(); //创建一个Function对象的实例
var myConctructor=function()
{
//somecode
}
//添加一个静态属性
myConstructor.name='Jeff';
myConstructor.alertName=function()
{
alert(this.name);
}
myConstructor.alertName();
//但是,name,alertName不会在新实例中
var anotherExample=new myConstructor();
anotherExample.alertName();//not a function 错误
  • 像原型中添加静态方法
//创建构造函数
functionmyConstrctor(message)
{
alert(message);
this.myMessage=message;
}
//添加一个公共方法(在底层添加)
myConstructor.prototype.clearMessage=function(string)
{
this.myMessage+=''+string;
}
//可以在新的实例上调用该方法
var myObject=new myConstructor('Hello World!');
myObject.clearMessage();

通过私有和特权成员控制访问(只需在该构造函数中使用普通的var和fuction关键字即可)

//创建构造函数
function myConstrctor(message)
{
this.myMessage=message;
//私有属性
var separator='-';
var myOwner=this;
//私有方法
function alertMessage()
{
alert(myOwner.message);
}
//在实例化时显示信息;
alertMessage();
} //如果通过如下方法,则出错
myConstructor.prototype.appendToMessage=function(string)
{
this.myMessage+=seqarator+string;//出错 未定义
}
//特权方法只得是在构造函数中的作用域中使用this关键字定义的方法
//创建构造函数
function myConstrctor(message)
{
this.myMessage=message;
//私有属性
var separator='-';
var myOwner=this;
//私有方法
function alertMessage()
{
alert(myOwner.message);
}
//在实例化时显示信息;
alertMessage(); //特权方法
this.appendToMessage=function(string)
{
this.mymessage+=separator+string;
alertMessage();
}
}
//这时候就可以
var myObject=new myConstructor('Hello World');
myObject.appendToMessage('Jeff'); //但是仍然不能用下面方法:
myObject.alertMessage();//not found
  • 共有、私有、特权、静态成员真的那么重要么?
//创建构造函数
function myConstrctor(message)
{
this.myMessage=message;
//私有属性
var separator='-';
var myOwner=this;
//私有方法
function alertMessage()
{
alert(myOwner.message);
}
//在实例化时显示信息;
alertMessage(); //特权方法
this.appendToMessage=function(string)
{
this.mymessage+=separator+string;
alertMessage();
}
}
//共有方法
myConstructor.prototype.clearMessage=function(string)
{
this.myMessage='';
}
//静态属性
myConctructor.name='Jeff'; //静态方法
myConstructor.alertName=function()
{
alert(this.name);
}

记住一下几天规则可以保证你对所有成员的身份做出适当的界定:

  • 由于私有和特权成员在函数内部。新词他们会被带到函数的每个实例中。
  • 共有的原型成员是对象蓝图的一部分,适用于通过new关键字实例化的该对象的每个实例
  • 静态成员只使用于对象的一个特殊实例。
  • 对象字面量

JavaScript DOM高级程序设计2.1创建可重用的对象--我要坚持到底!的更多相关文章

  1. JavaScript DOM 高级程序设计读书笔记一

    创建可重用的对象 简而言之,对象就是包含一组变量(称为属性)和函数(称为方法)的集合的实例.对象通常由类派生而来,而类中定义了对象拥有的属性和方法.如果你的脚本中都是对象之间的交互操作,那么就可以称之 ...

  2. JavaScript DOM高级程序设计 7.向应用程序加入Ajax--我要坚持到底!

    有时候,或许是因为理解能力,也或许是因为浮躁,看东西总是不入心,而且还老是想跳过本节,或者赶紧看完本节,这样的恶性循环,让我在即没有真正的学习到知识,又打击我的学习信心,还浪费了我很多事件,我想,当遇 ...

  3. JavaScript DOM高级程序设计 3.6 实例 将HTML代码转换成DOM代码(附源码)--我要坚持到底!

    作为一名Web开发者,最讨厌的事情就是重复性任务,摆脱乏味的日常重复性事物的一种方法,是借助可重用的对象或者说与你现在建立的ADS库类似的库,另外一种让事情变得有意思,且能够加速开发进程的方式是编写能 ...

  4. JavaScript DOM高级程序设计1.2-循序最佳实践--我要坚持到底!

    我这人,最大的毛病就是浮躁. 下面开始我再一次的学习之旅,希望我能坚持到最后.记笔记除了分享以外,更重要的是让自己看见自己学习之路. 先把ADS库贴出来http://vdisk.weibo.com/s ...

  5. JavaScript DOM高级程序设计 4.3控制事件流和注册事件侦听器--我要坚持到底!

    一.事件流 我们通过下面一个实例,进行说明. <body> <h1>Event Flow</h1> <ul id="nav"> &l ...

  6. JavaScript DOM高级程序设计 3.-DOM2和HTML2--我要坚持到底!

    由一个HTML进行说明,我就不敲了,直接copy <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" " ...

  7. JavaScript DOM高级程序设计 5动态修改样式和层叠样式表1(源代码)--我要坚持到底!

    W3C DOM2样式规范 现在这边贴出本章要的源代码,注意要结合前面用到的ADS库http://vdisk.weibo.com/s/Dq8NU CSSStyleSheet对象属性: type :始终是 ...

  8. JavaScript DOM高级程序设计 2.4-try{}catch{}--我要坚持到底!

    先看一段有异常的语句 var sound = 'Roar!'; function myOrneryBeast() { this.style.color='green';//window没有style属 ...

  9. JavaScript DOM 高级程序设计读书笔记二

    响应用户操作和事件 事件就是操作检测与脚本执行的组合,或者基于检测到的操作类型在某个对象上调用事件侦听器(事件处理程序). 事件的类型 事件可以分为几种类型:对象事件,鼠标事件,键盘事件(只适用于do ...

随机推荐

  1. 【winform】如何在DateTimePicker中显示时分秒

    1. 首先属性里面的Format属性value设置为Custom(默认为Long) 2. 对应的Custom属性value设置为yyyy-MM-dd HH:mm:ss

  2. 一句话解释jquery中offset、pageX, pageY、position、scrollTop, scrollLeft的区别

    offset   元素相对文档的偏移 pageX, pageY 事件(鼠标)相对文档的偏移 注意:文档是指document, 而不是当前窗口,是包含了滚动位置的,即滚动条的位置对这些值是不产生影响的 ...

  3. 纯CSS3代码实现简单的图片轮播

    以4张图片为例:1.基本布局:将4张图片左浮动横向并排放入一个div容器内,图片设置统一尺寸,div宽度设置4个图片的总尺寸,然后放入相框容器div,相框设置1个图片的大小并设置溢出隐藏,以保证正确显 ...

  4. Java Thread and runnable

    java中可有两种方式实现多线程, 一种是继承Thread类,(Thread本身实现了Runnable接口,就是说需要写void run 方法,来执行相关操作) 一种是实现Runnable接口 sta ...

  5. Meta标签中的format-detection属性及含义

    format-detection翻译成中文的意思是“格式检测”,顾名思义,它是用来检测html里的一些格式的,那关于meta的format-detection属性主要是有以下几个设置: meta na ...

  6. ACE_linux:任务 & 命令(Task and Command)

    1.涉及类 ACE_Task//ACE任务ACE_Activation_Queue//ACE命令队列 ACE_Method_Request//ACE请求(命令) 2.简介 ACE主动对象模式 主动对象 ...

  7. SharedPreference 的存取

    1.通过名称来获取指定的SharedPreferences,下面这句代码表示获取名字问hello的SharedPreferences,数据保存在 data/data/package名/shared_p ...

  8. Dapper.ColumnMapper 的使用

    using System; using System.Collections.Generic; using System.Data; using System.Data.SqlClient; usin ...

  9. Describe the difference between repeater, bridge and router.

    中继器,路由器,网桥,网关的区别. 路由器:网络层设备,实现复杂的路径选择,控制IP包从源到目的地的路径:根据IP地址进行选路和转发IP数据包 中继器:物理层设备,物理信号的重新生成,对信号进行整形和 ...

  10. sublime text2 配置php调试环境

    步骤一: 首先确保你电脑安装了php,并把php设置到环境变量里了. 步骤二: 点击 sublime_text的“工具”->"编译系统"->"编译新系统&qu ...