javascript进阶——面向对象特性
面向对象的javascript是这门语言被设计出来时就考虑的问题,熟悉OOP编程的概念后,学习不同的语言都会发现不同语言的实现是不同的,javascript的面向对象特性与其他具有面向对象特性的语言的实现的区别比较大,通过不断编程实践才能逐渐体会到面向对象的优点从而形成自己独特的javascript面向对象实现方式,这也是编写可重用代码的关键。
一、语言特性
1、引用
- var obj = new Object();
- var objRef = obj;
- obj.oneProperty = 1;
- alert(obj.oneProperty == objRef.oneProperty);//显示true
- var items = new Array("1","2","3");
- var itemsRef = items;
- items.push("4");
- alert(items.length == itemsRef.length);//结果是true,因为Array对象将数组元素作为其属性对象保存
- items = new Array("one","two","three");
- alert(items != itemsRef); //结果true,已经是两个不同的对象了
2、函数重载和类型检查
- 使用typeof操作符:返回一个字符串名称,表示变量内容的类型,当返回object时,自定义对象都是返回object,因此很难与其他对象区分。
- 构造函数constructor属性:引用的是原来用来构造该对象的那个函数名。
变量 | typeof的值 | 变量.constructor |
---|---|---|
{an:"object"} | "object" | Object |
["an","array"] | "object" | Array |
function(){} | "function" | Function |
"a string" | "string" | String |
55 | "number" | Number |
true | "boolean" | Boolean |
3、作用域与闭包
- function delayAlert(msg,time){
- setTimeout(function(){
- alert(msg);
- }, time);
- }
- delayAlert("welcome", 2000);//调用代码清晰简洁
- function add(num){
- return function(toAdd){return num + toAdd};
- }
- var addFive = add(5);
- alert(addFive(4) == 9); //结果true,闭包实现函数的Curry化
- var obj = document.getElementById("main");
- var items = ["click", "keypress"];
- for(var i = 0; i < items.length; i++){
- (function(){
- var item = items[i];
- obj["on" + item] = function(){alert(item);};
- })();
- }
- //使用匿名函数激发出作用域,for循环中获得当前循环时的i值
4、上下文对象
- function changeColor(color){
- this.style.color = color;
- }
- changeColor.call(document.getElementById("main"), "black");
二、面向对象编程
1、对象及方法
- 使用new Object(),再单独添加属性和方法。仅单独为此对象添加属性方法,重新实例化的对象没有这些属性方法。
- 使用{......}键值对创建。不能当做一个类来实例化新对象,只定义了一个对象,这就是实现单例设计模式的方法。当然从字面量实现创建新对象可以采用下面的方式:
- function object(o){
- function F(){};
- F.prototype = o;
- return new F();
- }
- var newObject = object(oldObject);
- function object(o){
- 使用构造函数创建,任何函数都可以被实例化为一个对象。
- function User(properties){
- for( var i in properties){ (function(which){
- var p = i;
- which["get" + p] = function(){return properties[p];};
- which["set" + p] = function(){properties[p] = val;};
- })(this);)
- }
- }
- //特权方法实例
- var user = new User({name:"Bob",age:44});
- alert(user.name == null); //没有name属性
- alert(user.getname() == "Bob");//动态获取属性
- user.setage(22);
- alert(user.getage() == 22);//动态获取
2、继承
- 原型式继承:对象的构造函数可以从其他对象中继承方法,它创建出一个原型对象后,所有其他的新对象都可以基于这个原型对象来构建。
- function Person(name){this.name = name;};
- Person.prototype.getName = function(){return this.name;};
- function User(name, password){this.name = name;
- this.password = password;};
- User.prototype = new Person();
- User.prototype.getPassword = function(){return this.password;};
其中User对象的原型prototype设置为一个Person对象,因此每当实例化User对象时,得到的每个User对象都会带有Person对象所有的方法,从而如同操作Person对象一样。这个技巧可以简化javascript的继承而编写一系列的包装函数。
- 类式继承:带有方法的类就可以实例化为对象。
- //继承自单一函数。将新函数绑定到对象的prototype上
- Function.prototype.method = function(name, func){
- this.prototype[name] = func;
- return this;
- };
- Function.method('inherits', function(parent){var this.prototype = new parent(); return this;});
- //从单一父对象继承所有内容
- Function.method('swiss', function(parent){
- for (var i = 1; i < arguments.length; i++){
- var name = arguments[i];
- this.prototype[name] = parent.prototype[name];
- }
- return this;
- });
改进原型式继承的代码:
- function Person(name){this.name = name;};
- Person.method("getName", function(){}return name;);
- function User( name, password){
- this.name = name;
- this.password = password;
- };
- User.inherits( Person);
- User.method('getPassword', function(){return this.password;});
- User.method('getName', function(){return this.name;});
3、继承库
- Base库,可以写出可读、有用好理解的面向对象javascript代码。
- Prototype库,一个为了配合Ruby on Rails的web开发框架配合设计的javascript库,给核心javascript对象添加了一大堆的函数和属性。
作为现代javascript语言的基础,面向对象javascript集合了众多长处,编写干净的面向对象javascript代码能为开发应用程序带来极大帮助。
javascript进阶——面向对象特性的更多相关文章
- 从 prototype.js 深入学习 javascript 的面向对象特性
从 prototype.js 深入学习 javascript 的面向对象特性 js是一门很强大的语言,灵活,方便. 目前我接触到的语言当中,从语法角度上讲,只有 Ruby 比它更爽. 不过我接触的动态 ...
- javascript 的面向对象特性参考
最近在看用javascript+css实现rich client.javascript 也是一个蛮有意思的语言.特别是其面向对象的实现和其他“标准”的OO launguage有很大的不同.但是,都是动 ...
- Javascript 进阶 面向对象编程 继承的一个样例
Javascript的难点就是面向对象编程,上一篇介绍了Javascript的两种继承方式:Javascript 进阶 继承.这篇使用一个样例来展示js怎样面向对象编程.以及怎样基于类实现继承. 1. ...
- Javascript 进阶 面向对象编程 继承的一个例子
Javascript的难点就是面向对象编程,上一篇介绍了Javascript的两种继承方式:Javascript 进阶 继承,这篇使用一个例子来展示js如何面向对象编程,以及如何基于类实现继承. 1. ...
- JavaScript进阶面向对象ES6
类和对象 对象:万物皆对象,对象是一个具体的事物,看得见摸得着的实物 对象是由属性和方法组成的: 属性:事物的特征,再对象中用属性来表示(常用名词) 方法:事物的行为,再对象中用方法来表示(常用动词) ...
- Javascript面向对象特性实现封装、继承、接口详细案例——进级高手篇
Javascript面向对象特性实现(封装.继承.接口) Javascript作为弱类型语言,和Java.php等服务端脚本语言相比,拥有极强的灵活性.对于小型的web需求,在编写javascript ...
- Javascript面向对象特性实现封装、继承、接口详细案例
Javascript面向对象特性实现(封装.继承.接口) Javascript作为弱类型语言,和Java.php等服务端脚本语言相比,拥有极强的灵活性.对于小型的web需求,在编写javascript ...
- JavaScript中面向对象的三大特性(一个菜鸟的不正经日常)
经过几天的学习,把jQuery给啃会了,但是运用的还不算特别熟练,总感觉自己在JavaScript方面的基础十分欠缺,所以继续拾起JavaScript,开始更好的编程之旅~ 今天学的是JavaScri ...
- JavaScript进阶之路(一)初学者的开始
一:写在前面的问题和话 一个javascript初学者的进阶之路! 背景:3年后端(ASP.NET)工作经验,javascript水平一般般,前端水平一般般.学习资料:犀牛书. 如有误导,或者错误的地 ...
随机推荐
- C#基础知识-对象初始化顺序
本文章转载:http://blog.csdn.net/forever_wind/article/details/7442503 不错的文章:http://www.cnblogs.com/McJerem ...
- MongoDB的地埋空间数据存储、空间索引以及空间查询
一.关于MongoDB 在众多NoSQL数据库,MongoDB是一个优秀的产品.其官方介绍如下: MongoDB (from "humongous") is a scalable, ...
- [HTTP] Origins, CROS, Preflight
Origins made up of three parts the data scheme, the hostname and the prot. It is important to know t ...
- 【转】Cocos2d-x 2.0 拖尾效果深入分析
Cocos2d-x 2.0 拖尾效果深入分析 另:本章所用Cocos2d-x版本为: cocos2d-2.0-x-2.0.2@ Aug 30 2012 http://cn.cocos2d-x.org/ ...
- linux启动的过程
总结一下,linux的开机整个流程. · 1: 启动电源后,主机第一步先做的就是查询BIOS(全称:basic input/output system 基本输入输出系统)信息.了解整个系统的硬件状态, ...
- ant有什么用
内容摘要: ANT是一个基于Java的自动化脚本引擎,脚本格式为XML.除了做Java编译相关任务外,ANT还可以通过插件实现很多应用的调用. 1)ANT的基本概念: 2)ANT的安装:解包,设置路径 ...
- 百度编辑器umeditor使用总结
百度编辑器是一个功能很全.很强大. 百度单张图片上传只能存储在项目下面,而不能独立自定义存储位置,因此重写上传代码 百度文章中的图片是通过base64实现的,直接存储在数据库中 tomcat通过虚拟路 ...
- Java 并发——多线程基础
Thead类与Runnable接口 Java的线程,即一个Thread实例. Java的线程执行过程有两种实现方式: 子类继承Thread类,并且重写void run()方法. 自定义类实现Runna ...
- 安卓SQLite数据库操作,半小时开发新闻管理系统,纯干货
本教程致力于可以快速的学习安卓软件开发,希望能通过一系列自己手写的教程,帮助正在学习或想要学习安卓开发的同仁. 本教程由今日头条-全栈攻城狮号首发,都是一个字一个字码的.请尊重劳动成果,转载请注明出处 ...
- mybatis错误:Invalid bound statement (not found)
解决办法是去看看mybatis配置里面的可能因为配置为什么格式文件解析不到 <property name="mapperLocations" value="clas ...