JavaScript对象原型

所有JavaScript对象都从原型继承属性和方法。

<!DOCTYPE html>
<html>
<meta charset="utf-8">
<title>js</title>
<body> <h2>JavaScript 对象</h2> <p id="demo"></p> <script>
function Person(first, last, age, eye) {
this.firstName = first;
this.lastName = last;
this.age = age;
this.eyeColor = eye;
} var myFather = new Person("John", "Doe", 50, "blue");
var myMother = new Person("Sally", "Rally", 48, "green"); document.getElementById("demo").innerHTML =
"My father is " + myFather.age + ". My mother is " + myMother.age;
</script> </body>
</html>

我们还了解到,您无法向现有对象构造函数添加新属性:

<!DOCTYPE html>
<html>
<meta charset="utf-8">
<title>JavaScript对象</title>
<body> <h2>JavaScript对象</h2> <p>您无法向构造函数添加新属性。</p> <p id="demo"></p> <script>
function Person(first, last, age, eye) {
this.firstName = first;
this.lastName = last;
this.age = age;
this.eyeColor = eye;
} Person.nationality = "English"; var myFather = new Person("John", "Doe", 50, "blue");
var myMother = new Person("Sally", "Rally", 48, "green"); document.getElementById("demo").innerHTML =
"The nationality of my father is " + myFather.nationality;
</script> </body>
</html>

要向构造函数添加新属性,必须将其添加到构造函数:

<!DOCTYPE html>
<html>
<meta charset="utf-8">
<title>JavaScript对象</title>
<body> <h2> JavaScript对象</h2> <p id="demo"></p> <script>
function Person(first, last, age, eye) {
this.firstName = first;
this.lastName = last;
this.age = age;
this.eyeColor = eye;
this.nationality = "English";
} var myFather = new Person("John", "Doe", 50, "blue");
var myMother = new Person("Sally", "Rally", 48, "green"); document.getElementById("demo").innerHTML =
"我父亲的国籍是 " + myFather.nationality + ". 我母亲的国籍是: " + myMother.nationality;
</script> </body>
</html>

原型继承

所有JavaScript对象都从原型继承属性和方法:

Object.prototype位于原型继承链的顶部:Date对象,Array对象和Person对象继承自Object.prototype。

* Date 对象继承自 Date.prototype
* Array 对象继承自 Array.prototype
* Person 对象继承自 Person.prototype

# 向对象添加属性和方法

有时,您希望向给定类型的所有现有对象添加新属性(或方法)。有时您想要向对象构造函数添加新属性(或方法)。

使用**原型**属性

JavaScript prototype属性允许您向对象构造函数添加新属性:

function Person(first, last, age, eyecolor) {
this.firstName = first;
this.lastName = last;
this.age = age;
this.eyeColor = eyecolor;
}
Person.prototype.nationality = "English";

JavaScript prototype属性还允许您向对象构造函数添加新方法:

function Person(first, last, age, eyecolor) {
this.firstName = first;
this.lastName = last;
this.age = age;
this.eyeColor = eyecolor;
}
Person.prototype.name = function() {
return this.firstName + " " + this.lastName;
};

更好的原型对象的文章

JavaScript prototype原型用法的更多相关文章

  1. javascript prototype原型链的原理

    javascript prototype原型链的原理 说到prototype,就不得不先说下new的过程. 我们先看看这样一段代码: <script type="text/javasc ...

  2. JavaScript prototype原型和原型链详解

    用过JavaScript的同学们肯定都对prototype如雷贯耳,但是这究竟是个什么东西却让初学者莫衷一是,只知道函数都会有一个prototype属性,可以为其添加函数供实例访问,其它的就不清楚了, ...

  3. JavaScript prototype原型链介绍

    javascript 是一种基于原型的编程 (prototype based programming) 的语言, 而与我们通常的基于类编程 (class based programming) 有很大的 ...

  4. javascript进阶-原型prototype

    一.javascript原型认识 很多编程语言都有类的概念,我们可以拿原型和类进行比较,看看它们之间的区别以及相同点在哪里. 1.类:类是一个具体事物的抽象所以类是一个抽象的东西,在面向对象中类可以用 ...

  5. JavaScript OOP(三):prototype原型对象(即构造函数的prototype属性)

    通过构造函数生成的实例化对象,无法共享属性或方法(即每个实例化对象上都有构造函数中的属性和方法):造成了一定的资源浪费 function Obj(name,age){ this.name=name; ...

  6. java基础64 JavaScript中的Arrays数组对象和prototype原型属性(网页知识)

    1.Arrays数组对象的创建方式 方式一: var 变量名=new Array(); //创建一个长度为0的数组. 方式二: var 变量名=new Array(长度); //创建一个指定长度的数组 ...

  7. JavaScript的原型链继承__propt__、prototype、constructor的理解、以及他们之间相互的关系。

    回想自己已经工作了有一段时间了,但是自己对JavaScript的原型链.和继承的理解能力没有到位,最近他们彻底的整理并且复习了一遍. 本案例中部分文案来自网络和书籍,如有侵权请联系我,我只是把我的理解 ...

  8. JavaScript 面向对象 原型(prototype) 继承

    1.对象的概念:无需属性的集合,属性可以为数值,对象或函数,ECMAscript中没有类的概念,这点是javascript与其他面向对象(OO)语言不同的地方. //创建一个自定义对象 var per ...

  9. 理解 JavaScript 对象原型、原型链如何工作、如何向 prototype 属性添加新的方法。

    JavaScript 常被描述为一种基于原型的语言 (prototype-based language)——每个对象拥有一个原型对象,对象以其原型为模板.从原型继承方法和属性.原型对象也可能拥有原型, ...

随机推荐

  1. 在 VS Code 中遇到的一些问题

    1.在安装时未配置右键快捷菜单,想重新添加 最简单的就是重新安装一遍,在安装过程中选择好. 其次可以通过以下注册表脚本导入(保存为 .reg 文件),注意因为有中文字符,需要使用记事本保存为 ANSI ...

  2. swift个人总结

    最近iOS10 已经开始正式使用,研究使用了swift3.0,将一些总结记录于此,以便以后查阅.持续更新中. swift中一般将一些功能相近的方法写在同一个延展中,便于代码的规范,找起来也方便.区别o ...

  3. Event事件、进程池与线程池、协程

    目录 Event事件 进程池与线程池 多线程爬取梨视频 协程 协程目的 gevent TCP服务端socket套接字实现协程 Event事件 用来控制线程的执行 出现e.wait(),就会把这个线程设 ...

  4. JAVA 中 Map 与实体类相互转换的简单方法

    1. 在 pom.xml 中引入依赖包 <dependency> <groupId>com.alibaba</groupId> <artifactId> ...

  5. mysql里字符集的配置

    [client]default-character-set=utf8[mysqld]character-set-server = utf8[mysql]default-character-set=ut ...

  6. 2018年蓝桥杯B组C/C++决赛题解

    2018年第九届蓝桥杯B组C/C++决赛题解 点击查看2018年蓝桥杯B组C/C++决赛题目(不含答案) 1.换零钞 ok 枚举 设x表示1元钱的个数,y表示2元钱的个数,z表示5元钱的个数 x+21 ...

  7. Pwn-level2(x64)

    题目地址 https://dn.jarvisoj.com/challengefiles/level2_x64.04d700633c6dc26afc6a1e7e9df8c94e 已经知道了它是64位了, ...

  8. 关于appium的简单理解

    搭建好appium环境后,要学会定位app页面上的元素.下面是2款元素定位工具 uiautomatorviewer   -- Android SDK自带的元素定位工具,由Google开发的 Inspe ...

  9. [C3] 正则化(Regularization)

    正则化(Regularization - Solving the Problem of Overfitting) 欠拟合(高偏差) VS 过度拟合(高方差) Underfitting, or high ...

  10. lua 6 函数

    定义: function max(num1, num2) local result = 0 if (num1 > num2) then result = num1; else result = ...