js 原型规则与示例
五大规则
1. 所有的引用类型( 数组 对象 函数 ) 都是 具有对象特性即自由拓展属性 (除了 ”null“)意外
2. 所有的引用类型(数组 对象 函数 ) 都有一个 proto 属性属性值是一个普通的对象
3. 所有的函数 都有一个prototype 属性 ,属性值也是一个普通的对象
4. 所有的引用类型(数组 对象 函数),proto 属性值指向它的构造函数 ”prototype“ 属性值
5. 当试图得到一个对象的某个属性时,如果这个对象本身没有这个属性那么会去它的__proto__(即它的构造函数的prototype寻找)
示例
<script>
// 构造函数
function Foo(name , age){
this.name = name;
this.age = age;
this.class = "class-1";
return this; // 默认有这一行
}
var f = new Foo( "bobo" ,22); // 实例化对象
var a = {} 其实 是 var a = new Object();
var a = [] 其实 是 var a = new Array();
function Foo(){} 其实 是 var Foo = new Function();
使用instanceof 判断函数是否是一个变量的构造函数
如何判断一个变量是不是数组 : 用instanceof Array
// 二、原型规则和示例
// 原型规则是学习原型链的基础
1. 所有的引用类型( 数组 对象 函数 ) 都是 具有对象特性 即自由拓展属性 (除了 ”null“)意外
拓展性
var obj = {} ; a.age = 100;
var arr = [] ; b.a = 100;
function fn (){}
fn.a = 100;
2. 所有的引用类型(数组 对象 函数 ) 都有一个 proto 属性,属性值是一个普通的对象
// __proto__ 隐式类型
console.log(obj.__proto__);
console.log(arr.__proto__);
console.log(fn.__proto__);
3. 所有的函数 都有一个prototype 属性 ,属性值也是一个普通的对象
// prototype 显示类型
console.log( fn.prototype );
4. 所有的引用类型(数组 对象 函数),proto 属性值指向 它的构造函数 ”prototype“ 属性值
console.log( obj.__proto__ === Object.prototype)
5. 当试图得到一个对象的某个属性时,如果这个对象本身没有这个属性 那么会去它的__proto__(即它的构造函数的prototype寻找)
// 构造函数
function Foo(name , age ){
this.name = name ;
}
Foo.prototype.alertName = function(){
alert( this.name );
}
// 创建示例
var f = new Foo("zhangsan");
f.printName = function(){
console.log(this.name);
}
// 测试
f.printName();
f.alertName();
6. this
7. 循环对象自身的属性
var item ;
for( item in f ){
高级浏览器已经在 for in 中屏蔽了来自原型(prototype)的属性
但是这里建议大家还是加上这个判断
保证程序的健壮性
if( f.hasOwnProperty(item)){
console.log(item)
}
}
</script>
js 原型规则与示例的更多相关文章
- JS中的原型规则与原型链
1. 原型规则 A. 所有的引用类型(数组.对象.函数),都具有对象特性,即可自由扩展属性: var arr = []; arr.a = 1;B. 所有的引用类型(数组.对象.函数),都有一个_pro ...
- js原型
1.js基本类型和对象类型 js的简单类型包括数字(其中NaN为数字类型).字符串(类似'A'为字符,js没字符类型).布尔值.null值和undefined值.其他所有的值都是对象.数字.字符串和布 ...
- JS 原型链图形详解
JS原型链 这篇文章是「深入ECMA-262-3」系列的一个概览和摘要.每个部分都包含了对应章节的链接,所以你可以阅读它们以便对其有更深的理解. 对象 ECMAScript做为一个高度抽象的面向对象语 ...
- js 原型链和继承(转)
在理解继承之前,需要知道 js 的三个东西: 什么是 JS 原型链 this 的值到底是什么 JS 的 new 到底是干什么的 1. 什么是 JS 原型链? 我们知道 JS 有对象,比如 var ob ...
- js原型浅谈理解
之前在学习原型(prototype)的时候,一直对原型的理解不是很清晰,只是知道每个对象都有一个原型,然后在js中万物又皆对象.在这里谈一下自己对于js原型的简单理解吧. 原型可以实现属性和方法的共享 ...
- JS原型链与继承别再被问倒了
原文:详解JS原型链与继承 摘自JavaScript高级程序设计: 继承是OO语言中的一个最为人津津乐道的概念.许多OO语言都支持两种继承方式: 接口继承 和 实现继承 .接口继承只继承方法签名,而实 ...
- JS(原型和原型链)
(学习自慕课网<前端JavaScript 面试技巧> JS(原型和原型链) 题目1.如何准确判断一个变量是数组类型 使用 instanceof 方法 题目2.写一个原型链继承的例子 实例: ...
- 【学习笔记】深入理解js原型和闭包系列学习笔记——精华
深入理解js原型和闭包笔记: 1.“一切皆是对象”,对象是属性的集合. 丨 函数也是对象,但是使用typeof时为什么函数返回function而 丨 不是object呢,js为何要对函数做这样的区分 ...
- 【学习笔记】深入理解js原型和闭包(12)——简介【作用域】
提到作用域,有一句话大家(有js开发经验者)可能比较熟悉:“javascript没有块级作用域”.所谓“块”,就是大括号“{}”中间的语句.例如if语句: 再比如for语句: 所以,我们在编写代码的时 ...
随机推荐
- RobotFrame连接MySql数据库
RobotFrame连接MySql数据库这类的教程网上并不多,就算有,也是很多坑.小编今天为大家提供一个靠谱的教程,但是具体的包需要大家自己下载.废话不多说,看疗效~~~ 1.pip install ...
- 简易排水简车的制作 TurnipBit 系列教程
准备工作 ü TurnipBit 开发板 1块 ü 下载数据线 1条 ü 微型步进电机(28BYJ-48) 1个 ü 步进电机驱动板(ULN2003APG) 1块 ü TurnipBit 扩展板 ...
- 见招拆招-PostgreSQL中文全文索引效率优化
* { color: #3e3e3e } body { font-family: "Helvetica Neue", Helvetica, "Hiragino Sans ...
- ASP.NET Core 一步步搭建个人网站(5)_Api模拟和网站分析
前言 经过前面几章,我们的网站已经最基本的功能,接下来就是继续拓展其他的功能,这期一起来实现一个该网站流量分析的工具,统计出这个网站每天用户相关数据,不仅要满足了我们对流量统计数字的基本要求,并且用更 ...
- Java学习笔记11(面向对象四:多态)
多态: 举例:描述一个事物的多种形态,如Student类继承了Person类,一个Student对象既是Student,又是Person 多态体现为:父类引用变量可以指向子类对象 多态的前提:必须有子 ...
- 运用OpenMP提速图像处理速度
一.算法测试 // openmptest的测试程序#include "stdafx.h"void Test(int n){ for (int i=0;i<10000;i ...
- input表单的type属性详解,不同type不同属性之间区别
目标:详解表单input标签type属性常用的属性值 一.input标签和它的type属性 PS:input 元素可以用来生成一个供用户输入数据的简单文本框. 在默认的情况下, 什么样的数据均可以输入 ...
- 使用jemeter手工编写注册、登陆脚本 运用 fiddler (一)
我们要使用jemeter来手工写一个脚本 我们要使用到两个工具 一个 就是 jmeter 一个就是 fiddler 为什么要使用fiddler ? 因为能够帮我们正确精准的找到我们需要的数据 ...
- Erlang gen_server进程花样作死
本文主要记录各种情况下gen_server进程退出的表现. 研究动机起源于Elixir/Phoenix框架中遇到的一个进程异常退出问题.因为网络异常,客户端超过一段时间未发来消息,channel进程( ...
- Java_web学习(一) jdk配置
1.下载好jdk1.8.0版本或以上版本 2.配置JAVA_HOME,CLASSPATH,PATH 其中JAVA_HOME必须的 2.1 JAVA_HOME=E:\java\jdk1.8.0_77 ...