从零开始的全栈工程师——JS面向对象( 原型 this 继承)
一、生成对象的方式
①单例模式(字面量定义)var obj = {}
②类的实例 var obj = new Object( )
③工厂模式
④构造函数:扮演三种角色 普通函数 普通对象 类
工厂模式
构造函数
构造函数如果人为return的不是对象 直接忽略 如果人为return的是对象 就取代this <-- ! ! ! ! ! ! ! ! !
二、工厂模式和构造函数的区别
1. 工厂模式 生成的对象必须要返回 构造函数模式不用return
构造函数模式默认return的是this 在构造函数内的this就是实例对象
2.工厂模式生成的实例对象的__proto__直接指向基类Object的原型
构造函数生成的实例对象的__proto__指向他父类的原型 然后父类的原型上的__proto__指向基类Object的原型
三、实例
1.
每个实例和实例之间都是独立的个体 他们之间的属性互不干扰 是不等的 如果实例和实例之间的属性相对
则这个属性必须是父类的原型上的属性 是因为父类原型上的属性是可继承的 是共享的
( 每个实例对象都会生成一个独立空间 并且互不干扰 )
2.原型链
在操作obj.属性的时候 首先看这个属性是私有的还是从父类的原型上继承的 如果是私有的直接使用
如果私有的没有就查看父类的原型上有没有 如果有就直接使用 如果没有 再次向父类的父类的原型查找
直到找到Object位置 如果object也没有就得到undefined 这就是原型链

3.实例对象的原型就是他父类的原型
4.破坏原型链
如果不给类的原型指定一个对象 这个实例对象的__proto__上有一个constructor的属性
如果给这个类的原型上指定了一个对象 实例上的__proto__就没有constructor属性了
构造函数里的原型里的this都是指向实例对象

四、原型上的方法
1.instanceof 判断一个对象是不是这个类的方法

2.isPrototypeOf 判断一个对象是否是另一个对象的原型
3.getPrototypeOf 获取实例对象的原型 前面一定要是Object

4.hasOwnProperty 判断一个属性是不是自身私有的属性 括号后面加引号

5.in 判断这个属性是不是在这个对象上 不管是私有的还是公有的


五、this
1.this的指向
①this是一个对象 函数外的this都指向window
②函数内的this 他的指向跟函数调用有关 看函数前面有没有“.” 有“.”就指向“.”前面的对象 没有就指向window
③定时器里的this永远是window 自执行函数里的this是window
④构造函数里的this和原型上的this都指向实例对象
2.改变this指向的方法
①提前将this赋值 ②call ③applay ④bind
六、继承
1.call继承 --> 将父类的私有属性继承为子类的私有属性
function A () {
this.name = 'hua';
}
function B () {
this.age = 12;
A.call(this)
}
var a = new A()
var b = new B()
console.log(b.name) //hua
2.原型继承 --> 将父类的私有和公有属性都继承为子类的公有属性 子类的原型 = 父类的实例 B.prototype=new A()
function A () {
this.name = 'hua';
}
A.prototype.ss='sss';
function B () {
this.age = 12;
}
B.prototype = new A; //子类的原型等于父类的实例
var a = new A()
var b = new B()
console.log(b.ss)
从零开始的全栈工程师——JS面向对象( 原型 this 继承)的更多相关文章
- 从零开始的全栈工程师——JS面向对象( 六大继承 )
一.对象克隆 var obj = { name:'li', age:23 } var obj2 = obj; // 这不是对象克隆 只是把obj的内存地址给obj2 1.for in克隆(浅拷贝) ...
- 从零开始的全栈工程师——JS面向对象(复习)
作用域 栈内存:js执行的环境堆内存:存放代码块的空间 存放方式 键值对形式存放 字符串的形式存放js在执行之前 浏览器会给他一个全局作用域叫window 每个作用域下都分为两个模块 一个是内存模块一 ...
- 从零开始的全栈工程师——JS面向对象(初篇)
面向对象编程 面向对象编程是用抽象方式创建基于现实世界模型的一种编程模式.它使用先前建立的范例,包括模块化,多态和封装几种技术.今天,许多流行的编程语言(如Java,JavaScript,C#,C+ ...
- 从零开始的全栈工程师——js篇2.12(面向对象)
面向对象 Js一开始就是写网页特效,面向过程的,作者发现这样写不好,代码重复利用率太高,计算机内存消耗太大,网页性能很差. 所以作者就收到java和c的影响,往面向对象靠齐.Js天生有一个Object ...
- 从零开始的全栈工程师——js篇(作用域 this 原型笔试题练习)
作用域 // 1. fn() function fn () { console.log(12) } var as = function () { console.log(45) } // 2. var ...
- 从零开始的全栈工程师——js篇2.11(原型)
原型 原型分析 1.每个 函数数据类型(普通函数,类)都有一个prototype属性 并且这个属性是一个对象数据类型2.每个Prototype上都有一个constructor属性 并且这个属性值是当前 ...
- 从零开始的全栈工程师——js篇2.20(事件对象 冒泡与捕获)
一.复习 面向对象 1)单例模式 2)工厂模式 3)构造函数 ①类js天生自带的类 基类object function array number math boolean date regexp st ...
- 从零开始的全栈工程师——js篇2.10(对象与构造函数)
对象与构造函数 一.js数据类型 基本数据类型:string undefined null boolean number 引用数据类型 Object array function 二 ...
- 从零开始的全栈工程师——js篇2.5
数据类型与全局属性 js的本质就是处理数据 数据来自于后台的数据库所以变量就起到一个临时存储数据的这作用ECMAscirpt 制定了js的数据类型 一.数据类型 1.基本数据类型 基本数据类型就是简单 ...
随机推荐
- 【重要的css属性学习】看了乙醇的文章,统计了几个高star前端框架下,Css属性出现最多的,这里学习记录一下
color background-color display margin-left border-color padding max-width margin-bottom width flex 待 ...
- TX2 Clone
由于给TX2配置了很多的开发环境,也修改了一些驱动,想将这些环境能够完整的迁移到一块bare TX2,于是尝试了clone的方法. 这种方法的优点是: 确保了移植的TX2 与已经配置好的环境是一致的: ...
- Apache 配置 虚拟主机
<VirtualHost *:80> ServerName tongcheng.5q88.cn:80 ServerAlias DirectoryIndex index.html index ...
- 洛谷 P2486 [SDOI2011]染色(树链剖分+线段树)
题目链接 题解 比较裸的树链剖分 好像树链剖分的题都很裸 线段树中维护一个区间最左和最右的颜色,和答案 合并判断一下中间一段就可以了 比较考验代码能力 Code #include<bits/st ...
- 报表中经常遇到的一个头疼的问题是需要自动选择过去一个月的数据作为当前报表输出。网上查询了一些.NET 的C#例子,发现都实现的比较复杂
报表中经常遇到的一个头疼的问题是需要自动选择过去一个月的数据作为当前报表输出.网上查询了一些.NET 的C#例子,发现都实现的比较复杂,其实这个问题可以很简单的通过.NET的DateTime函数来实现 ...
- oracle数据库操纵语言DML
oracle数据库操纵语言:DML 添加数据: ()直接添加数据: insert into table_name(column_name1,column_name2,...) values(data1 ...
- Flask之flask-script 指定端口
简介 Flask-Scropt插件为在Flask里编写额外的脚本提供了支持.这包括运行一个开发服务器,一个定制的Python命令行,用于执行初始化数据库.定时任务和其他属于web应用之外的命令行任务的 ...
- WPF 布局
WPF布局原则 WPF窗口只能包含单个元素,为在WPF窗口中放置多个元素并创建更贴近使用的用户界面,需要在窗口上放置一个容器,然后在这个容器中添加其他元素 遵循以下几条重要原则 不应显式设定元素(如控 ...
- 文件对象FSO应用 文件对象FSO应用
FileSystemObject对象被用来访问服务器上的文件系统.这个对象能够处理文件.文件夹和目录路径.用它来检索文件系统信息也是可能的. 下面的代码创建了一个文本文件,并写入了一些文本: dim ...
- 在OnActionExecuted 获取请求参数的值(包含类类型)
1.在OnActionExecuting里 获取请求参数的值 比较简单 /// <summary> /// 获取首参数的值 /// </summary> /// <par ...