JS面向对象基础
以往写代码仅仅是为了实现特定的功能,后期维护或别人重用的时候,困难很大。
Javascript作为完全面向对象的语言,要写出最优的代码,需要理解对象是如何工作的。
1.
对象是javascript的基础,对象是一系列属性的集合,类似其他语言的散列表。
如下两个创建对象,并实现属性的例子是相同的。
var obj = new Object();
//给对象Obj设置一系列的属性
obj.name = "rxm";
obj.getAge = function()
{ return (new Date()).getFullYear() - 1986; };
//---------------------------------------
//结合键值对来重写对象
var obj = {
name: "rxm",
getAge: function() { return (new Date()).getFullYear() - 1986; }
};
2.
Javascript中,对象本身可以用来创建新对象,对象也可以继承自其他对象,这称为“原型化继承”。
<script
language="javascript"
type="text/javascript">
function User(name) {
this.name = name;
}
var my =
new User("rxm");
var you =
new my.constructor("cwr");
alert(my.name == "rxm");
//true
alert(typeof my ==
typeof you); //true
User("bj");
//对象上下文未设定,默认为window.
alert(window.name); //bj
</script>
1)公共方法
要实现在每个实例中都用到的公共方法,需了解prototype(原型)属性,这个属性包含了一个对象,此对象可以作为所有新副本的基引用。
function User(name, age) {
this.name = name;
this.age = age;
}
User.prototype.getName = function() {
return
this.name;
}
User.prototype.getAge = function() {
return
this.age;
}
var my =
new User("rxm", 27);
alert(my.getAge()); //每个实例化的对象都可以访问prototype属性添加的属性
alert(my.getName());
2)私有方法
只能有构造函数访问的私有函数的例子:
function User(name, age) {
this.name = name;
this.age = age;
function getName() {
return
this.name;
}
}
var my =
new User("rxm", 27);
my.getName(); //调用失败[运行时错误: 对象不支持此属性或方法]
3)特权方法
指那些在处理对象私有变量的同时,允许用公共方式访问的方法。
function User(age) {
var year = (new Date()).getFullYear() - age;
this.getAge =
function() {
return year;
}
}
var my =
new User(27);
alert(my.getAge());//1986
alert(my.year);//我们无法访问对象的私有属性
动态生成代码的能力是不能小视的,能够根据运行时生成代码是十分的有用。
//创建一个新的用户对象,接收一个有许多属性的对象作为参数
function User(properties) {
//遍历每一个属性,设置读取器和设置器
for (var i
in properties) {
(function(which) {
var p = i;
which["set" + p] =
function(val) {
properties[p] = val;
}
which["get" + p] =
function() {
return properties[p];
}
}
)(this);
}
}
var user =
new User({
name:"rxm",
age:27 });
alert(user.name); //没有这么个属性
alert(user.getname()); //rxm
函数是动态生成的
alert(user.getage());//27
)静态方法,类似C# static
function Person(name) {
this.name = name;
this.getname =
function()
{ return
"my name is " + this.name; };
}
Person.mouth = 1;
var my =
new Person("rxm");
alert(my.getname());//实例的
alert(Person.mouth);//静态的
JS面向对象基础的更多相关文章
- JavaScript基础精华02(函数声明,arguments对象,匿名函数,JS面向对象基础)
函数声明 JavaScript中声明函数的方式:(无需声明返回值类型) function add(i1, i2) { return i1 + i2;//如果不写return返回 ...
- [Js]面向对象基础
一.什么是对象 对象是一个整体,对对外提供一些操作 二.什么是面向对象 使用对象时,只关注对象提供的功能,不关注其内部细节,比如Jquery 三.Js中面向对象的特点 1.抽象:抓住核心问题 2.封装 ...
- 第十四节 JS面向对象基础
什么是面向对象:在不需要知道它内部结构和原理的情况下,能够有效的使用它,比如,电视.洗衣机等也可以被定义为对象 什么是对象:在Java中对象就是“类的实体化”,在JavaScript中基本相同:对象是 ...
- JS面向对象基础讲解(工厂模式、构造函数模式、原型模式、混合模式、动态原型模式)
什么是面向对象?面向对象是一种思想. 面向对象可以把程序中的关键模块都视为对象, 而模块拥有属性及方法. 这样如果我们把一些属性及方法封装起来,日后使用将非常方便,也可以避免繁琐重复的工作. 工厂 ...
- js面向对象基础总结
js中如何定义一个类? 定义的function就是一个构造方法也就是说是定义了一个类:用这个方法可以new新对象出来. function Person(name, age){ this.name = ...
- JS面向对象基础2
根据之前看了面向对象相关的视频,按照自己的理解,整理出相关的笔记,以便自己的深入理解. javascript面向对象: 突发奇想,注意:===全等:是指既比较值,也比较类型(题外话,可忽略) 逻辑运算 ...
- JS面向对象基础1
根据之前看了面向对象相关的视频,按照自己的理解,整理出相关的笔记,以便自己的深入理解. 如果要判断两个数是否相等,将值乘以10或者100,转换成整数再进行比较 例如:a++与++a 短路运算符 ...
- 从壹开始前后端分离 [ Vue2.0+.NET Core2.1] 十五 ║Vue基础:JS面向对象&字面量& this字
缘起 书接上文<从壹开始前后端分离 [ Vue2.0+.NET Core2.1] 十四 ║ VUE 计划书 & 我的前后端开发简史>,昨天咱们说到了以我的经历说明的web开发经历的 ...
- js面向对象开发基础
js的面向对象开发能力较弱,基本是以prototype为核心的面向对象,虽然现在出了个class这玩意,但本文还是先不做探讨. 面向对象基础——构造函数方法 var Fly = function (s ...
随机推荐
- ASP.NET 读数据库绑定到 TreeView 递归方式
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs& ...
- JS电子文档链接
http://www.oschina.net/translate/learning-javascript-design-patterns 学用 JavaScript 设计模式 http://es6 ...
- JavaScript在智能手机上的应用-通过滑动修改网页字体大小
---------------------------------- <script type="text/javascript"> //变量x, ...
- git远程分支--remote
查看所有远程引用: $ git ls-remote From ssh://someone@example/testgit ebf3ef7551603cd57a699e80db0bfab36d1aa7b ...
- vs 发布web应用程序时,找不到cs文件错误
将*.aspx.*.ascx.*.master所有出错页面文件中的 CodeFile="******.aspx.cs" 批量替换成 Codebehind="******. ...
- octet-stream
firefox突然变成了用gedit打开pdf文件, Where the link to http://download.jw.org/files/media_m...E_20150201.pdf c ...
- T-shirts Distribution
T-shirts Distribution time limit per test 1 second memory limit per test 256 megabytes input standar ...
- c++运行时类型识别(rtti)
一个简单运行时类型识别 namespace rtti_ex { /* * 类型信息基类 */ class i_type_info { public: // 判断是否是指定类型 bool is(cons ...
- [Eclispe] NDK内建include路径修改
[Eclispe] NDK内建include路径修改 编辑 jni/android.mk 中 LOCAL_C_INCLUDES 变量后,该变量值将被列入项目属性的内建include头文件包含路径,无法 ...
- win8.1点击“更改电脑设置”无反应(闪退)
系统:win8.1 专业版 症状:win键+C → 设置 → 更改电脑设置,无反应. 尝试办法: 1.SFC /scannow扫描修复,扫描出错误但无法修复.因为曾经为了节省空间,用DISM++清理了 ...