2.JavaScript中的原型规则以及原型设计模式
原型规则
- 原型规则
- 所有的引用类型(数组、对象、函数),都具有对象特征,即可自由扩展属性;
- 所有的引用类型,都有一个_proto_ 属性(隐式原型),属性值是一个普通对象;
- 所有函数,都具有一个prototype(显示原型),属性值也是一个普通原型;
- 所有的引用类型(数组、对象、函数),其隐式原型指向其构造函数的显式原型;(obj.proto === Object.prototype);
- 当试图得到一个对象的某个属性时,如果这个对象本身没有这个属性,那么会去它的_proto_(即它的构造函数的prototype)中去寻找;
- 原型对象:prototype 在js中,函数对象其中一个属性:原型对象prototype。普通对象没有prototype属性,但有_proto_属性。 原型的作用就是给这个类的每一个对象都添加一个统一的方法,在原型中定义的方法和属性都是被所以实例对象所共享。
var person = function(name){
this.name = name
};
person.prototype.getName=function(){//通过person.prototype设置函数对象属性
return this.name;
}
var crazy= new person(‘crazyLee’);
crazy.getName(); //crazyLee//crazy继承上属性 - 原型链 当试图得到一个对象f的某个属性时,如果这个对象本身没有这个属性,那么会去它的_proto_(即它的构造函数的prototype)obj._proto_中去寻找;当obj._proto也没有时,便会在obj._proto.proto(即obj的构造函数的prototype的构造函数的prototype)中寻找;
设计模式
- 工厂模式
在函数内创建一个对象,给对象赋予属性及方法再将对象返回
function Person() {
var People = new Object();
People.name = 'CrazyLee';
People.age = '25';
People.sex = function(){
return 'boy';
};
return People;
} var a = Person();
console.log(a.name);//CrazyLee
console.log(a.sex());//boy
- 构造函数模式
无需在函数内部重新创建对象,而是用this指代
function Person() {
this.name = 'CrazyLee';
this.age = '25';
this.sex = function(){
return 'boy'
}; } var a = new Person();
console.log(a.name);//CrazyLee
console.log(a.sex());//boy
- 原型模式
函数中不对属性进行定义,利用prototype属性对属性进行定义,可以让所有对象实例共享它所包含的属性及方法。
function Parent() {
Parent.prototype.name = 'carzy';
Parent.prototype.age = '24';
Parent.prototype.sex = function() {
var s="女";
console.log(s);
}
} var x =new Parent();
console.log(x.name); //crazy
console.log(x.sex()); //女
- 混合模式
原型模式+构造函数模式。这种模式中,构造函数模式用于定义实例属性,而原型模式用于定义方法和共享属性
function Parent(){
this.name="CrazyLee";
this.age=24;
};
Parent.prototype.sayname=function(){
return this.name;
}; var x =new Parent();
console.log(x.sayname()); //Crazy
- 动态原型模式
将所有信息封装在了构造函数中,而通过构造函数中初始化原型,这个可以通过判断该方法是否有效而选择是否需要初始化原型。
function Parent(){
this.name="CrazyLee";
this.age=24;
if(typeof Parent._sayname=="undefined"){
Parent.prototype.sayname=function(){
return this.name;
}
Parent._sayname=true;
}
}; var x =new Parent();
console.log(x.sayname());
2.JavaScript中的原型规则以及原型设计模式的更多相关文章
- 关于Javascript中通过实例对象修改原型对象属性值的问题
Javascript中的数据值有两大类:基本类型的数据值和引用类型的数据值. 基本类型的数据值有5种:null.undefined.number.boolean和string. 引用类型的数据值往大的 ...
- JS中的原型规则与原型链
1. 原型规则 A. 所有的引用类型(数组.对象.函数),都具有对象特性,即可自由扩展属性: var arr = []; arr.a = 1;B. 所有的引用类型(数组.对象.函数),都有一个_pro ...
- javascript中算术运算符规则
javascript中提供了几种算术运算符,+(加) -(减) *(乘) /(除) %(余),常规用法与数学上的一致: 但还规定一些特殊规则: 注:JavaScript中保存数值的方式,可以 ...
- JavaScript中常见的十五种设计模式
在程序设计中有很多实用的设计模式,而其中大部分语言的实现都是基于“类”. 在JavaScript中并没有类这种概念,JS中的函数属于一等对象,在JS中定义一个对象非常简单(var obj = {}), ...
- 对JavaScript中的静态属性和原型属性的理解
首先是在访问上的区别,当访问实例对象的某个属性但它本身没有时,它就会到原型中去查找,但不会去查找静态属性. // 实例对象不会去查找静态属性 function Foo(){} Foo.a = 1; v ...
- JavaScript中内存使用规则--堆和栈
堆和栈都是运行时内存中分配的一个数据区,因此也被称为堆区和栈区,但二者存储的数据类型和处理速度不同.堆(heap)用于复杂数据类型(引用类型)分配空间,例如数组对象.object对象:它是运行时动态分 ...
- javascript中变量命名规则
前言 变量的命名相对而言没有太多的技术含量,今天整理有关于变量命名相关的规则,主要是想告诉大家,虽然命名没有技术含量,但对于个人编码,或者说一个团队的再次开发及阅读是相当有用的.良好的书写规范可以让你 ...
- JavaScript中的比较规则之“==”运算符
"=="运算符(两个操作数的类型不相同时) 如果一个值是null,另一个值是undefined,则它们相等 如果一个值是数字,另一个值是字符串,先将字符串转换为数学,然后使用转换后 ...
- 一张图搞懂 Javascript 中的原型链、prototype、__proto__的关系 转载加自己的总结
1. JavaScript内置对象 所谓的内置对象 指的是:JavaScript本身就自己有的对象 可以直接拿来就用.例如Array String 等等.JavaScript一共有12内置对象 ...
随机推荐
- idea下新建Spring Boot项目并配置启动
一.操作步骤 ①使用idea新建一个Spring Boot项目 ②修改pom.xml ③修改application.properties ④修改编写一个Hello Spring Boot的Contro ...
- 201871010106-丁宣元 《2019面向对象程序设计(java)课程学习进度条》
<2019面向对象程序设计(java)课程学习进度条> 周次 (阅读/编写)代码行数 发布博客量/评论他人博客数量 课余学习时间(小时) 学习收获最大的程序阅读或编程任务 1 25/10 ...
- JDK1.8 LocalDate 使用方式;LocalDate 封装Util,LocalDate工具类(二)
未完待续 ........ java.time.*代替方案 1.Instant 代替 Date2.LocalDateTime 代替 Calendar3.DateTimeFormatter 代替 Sim ...
- django 解析上传xls文件
1.解析上传数据 class DataUploadAPIView(APIView): # authentication_classes = (JSONWebTokenAuthentication, S ...
- js提取DOM属性和设置DOM属性值
<style type="text/css"> #div1{width:100px;height:100px;} #div2{background} </styl ...
- python基础之九:文件操作
1.绝对路径与相对路径 path1 = "D:\orders.txt" # 绝对路径:包含根地址的路径 path2 = "homework.py" # 相对路径 ...
- LeetCode 691. Stickers to Spell Word
原题链接在这里:https://leetcode.com/problems/stickers-to-spell-word/ 题目: We are given N different types of ...
- Educational Codeforces Round 78 (Rated for Div. 2) B - A and B(思维)
- axios二次封装
import axios from "axios" //请求拦截器 axios.interceptors.request.use(function (config) { retur ...
- 【cf补题记录】Codeforces Round #608 (Div. 2)
比赛传送门 再次改下写博客的格式,以锻炼自己码字能力 A. Suits 题意:有四种材料,第一套西装需要 \(a\).\(d\) 各一件,卖 \(e\) 块:第二套西装需要 \(b\).\(c\).\ ...