以往写代码仅仅是为了实现特定的功能,后期维护或别人重用的时候,困难很大。

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面向对象基础的更多相关文章

  1. JavaScript基础精华02(函数声明,arguments对象,匿名函数,JS面向对象基础)

    函数声明 JavaScript中声明函数的方式:(无需声明返回值类型) function add(i1, i2) {             return i1 + i2;//如果不写return返回 ...

  2. [Js]面向对象基础

    一.什么是对象 对象是一个整体,对对外提供一些操作 二.什么是面向对象 使用对象时,只关注对象提供的功能,不关注其内部细节,比如Jquery 三.Js中面向对象的特点 1.抽象:抓住核心问题 2.封装 ...

  3. 第十四节 JS面向对象基础

    什么是面向对象:在不需要知道它内部结构和原理的情况下,能够有效的使用它,比如,电视.洗衣机等也可以被定义为对象 什么是对象:在Java中对象就是“类的实体化”,在JavaScript中基本相同:对象是 ...

  4. JS面向对象基础讲解(工厂模式、构造函数模式、原型模式、混合模式、动态原型模式)

    什么是面向对象?面向对象是一种思想. 面向对象可以把程序中的关键模块都视为对象, 而模块拥有属性及方法. 这样如果我们把一些属性及方法封装起来,日后使用将非常方便,也可以避免繁琐重复的工作.   工厂 ...

  5. js面向对象基础总结

     js中如何定义一个类? 定义的function就是一个构造方法也就是说是定义了一个类:用这个方法可以new新对象出来. function Person(name, age){ this.name = ...

  6. JS面向对象基础2

    根据之前看了面向对象相关的视频,按照自己的理解,整理出相关的笔记,以便自己的深入理解. javascript面向对象: 突发奇想,注意:===全等:是指既比较值,也比较类型(题外话,可忽略) 逻辑运算 ...

  7. JS面向对象基础1

    根据之前看了面向对象相关的视频,按照自己的理解,整理出相关的笔记,以便自己的深入理解.     如果要判断两个数是否相等,将值乘以10或者100,转换成整数再进行比较 例如:a++与++a 短路运算符 ...

  8. 从壹开始前后端分离 [ Vue2.0+.NET Core2.1] 十五 ║Vue基础:JS面向对象&字面量& this字

    缘起 书接上文<从壹开始前后端分离 [ Vue2.0+.NET Core2.1] 十四 ║ VUE 计划书 & 我的前后端开发简史>,昨天咱们说到了以我的经历说明的web开发经历的 ...

  9. js面向对象开发基础

    js的面向对象开发能力较弱,基本是以prototype为核心的面向对象,虽然现在出了个class这玩意,但本文还是先不做探讨. 面向对象基础——构造函数方法 var Fly = function (s ...

随机推荐

  1. git远程分支--remote

    查看所有远程引用: $ git ls-remote From ssh://someone@example/testgit ebf3ef7551603cd57a699e80db0bfab36d1aa7b ...

  2. Linux入门(一)常见虚拟机及Linux系统安装、xshell连接虚拟机

    1环境 linux常用两种虚拟机 1.1  oracle VM VirtualBox 官方网站:https://www.virtualbox.org/ 1.2  vmware  下载链接:https: ...

  3. A框架 第二部 实例化接收到的get类,调用父类抽象方法,自动执行方法call_user_func_array()

    01父类抽象类 abstract.php <?phpabstract class controller_abstract{ protected $app; function __construc ...

  4. Django: 之用户注册、缓存和静态网页

    Django 用户注册系统 Django 的源码中已经有登录,退出,重设密码等相关的视图函数,在下面这个app中 django.contrib.auth 可以点击对应的版本查看相关源代码:1.9  1 ...

  5. javascript小数乘法精确率问题

    做前端页面开发的经常会遇到数值的乘法计算,带小数位计算会出现值溢出的问题,如: JS里做小数的乘法运算时会出现浮点错误,具体可以测试一下: <script>alert(11*22.9)&l ...

  6. php过滤函数

    addcslashes — 以 C 语言风格使用反斜线转义字符串中的字符 addslashes — 使用反斜线引用字符串 strip_tags — 从字符串中去除 HTML 和 PHP 标记 stri ...

  7. asp.net无法触发asp控件的后台方法

    前台代码: <asp:Button ID="btnFinish" runat="server" Text="完成" Font-Size ...

  8. parted

    1.选择分区表 sudo parted -s /dev/sdXX mklabel gpt 2.创建分区 sudo parted -s -- /dev/sdX mkpart primary 0 -1s ...

  9. JSP简单标签标签库开发

    1.定制标签的实现类称为标签处理器,简单标签处理器指实现SimpleTag接口的类,如下图的SimpleTagSupport类,该类为SimpleTag接口的默认实现类. 注:不要直接实现Simple ...

  10. mouse的各种事件

    IE测试对象为IE9,不全 mousemove(元素内部移动) 鼠标在元素内部移动时触发,只要鼠标移动,即使只是又移动了一个像素,也会触发,这就意味着短时间内会触发多次事件 支持情况: js onmo ...