JavaScript(十三)面向对象
面向对象
面向对象的过程
通过new 构造函数 生成的对象来执行, 类似于事件的执行 this指向函数,然后再把这个函数赋值给一个实例 所以在函数内的this 就指到了实例上
function Person (age,lastname,) {
this.age = age
this.lastname = lastname;
}
var xiaoming = new Person(12,'小明');
console.log(xiaoming);
构造函数的首字母要大写 大家默认的规范
对象中若 value 非函数 叫做属性 若 是函数 叫方法
this的指向
普通对象,计时器,定时器,this 质量window
对象中的方法的this 指向这个对象,这个对象就和windows类似
绑定事件时 this指向 dom对象
闭包的this 指向上次运行的函数环境
自执行函数 指向window
对象中的定时器等的this仍是指向window 所以需要在对象内备份 this
实例与构造函数的关系
新生成的对象 有个属性 constructor 就是这个对象的构造函数
实例 instanceof 构造函数 ---->true
console.log(xiaoming.constructor);
console.log(xiaoming instanceof Person);
面向对象中的类的概念
就是 构造函数 ,同一个构造函数 new出来的 就属于一个类
原型
构造函数方法存在一定的弊端,对于对象中一成不变的属性 并不需要每次都new ,这样很浪费性能,那么 就把这用一成不变的存储到 构造函数的原型上面
function Person (age,name,) {
this.age = age;
this.name = name;
}
Person.prototype.sex = 'male'; var xiaoming = new Person(12,'xiaoming');
console.log(xiaoming.sex);//这个性别就是从原型上继承的
构造函数的原型除了以 fun.prototype.attr = ***; 的格式
还可以 写整个 原型
Person.prototype = {
age : ,
sex:'male',
constructor : Person //这里如果不写 new的实例调用constrotur 不会返回person 而返回 Object
}
prototype和__proto__
prototype 所有的函数都有原型prototype
.__proto__ 所有的对象都有原型对象 ∵所有的对象都是用构造函数创建的
constructor,protype与__proto__
判断这个实例是不是这个构造函数new的
构造函数的原型 .isProtypeOf(新对象)
利用 in 结合 hasOwnProperty判断是不是从原型继承来的属性
for (var pro in xiaoming) {
if(xiaoming.hasOwnProperty(pro)){
console.log(pro + '是本地属性')
}
}
绑定构造函数 两个对象(构造函数之间)继承
1.call / apply 用父类 代替子类的this
父构造函数.call(this,[arguments])
function Foo () {
this.lastName = 'wang';
} function Son (height) {
Foo.call(this); //就这一步就可以继承来 Foo的属性
this.height = height;
} var xw = new Son(180);
console.log(xw.lastName); //wang
prototype的继承方法
写在perotype 上的属性在生成实例的时候不会被 调用 所以 实例上的属性由继承来的更好 提取公共部分在原型上
function Foo() {
this.firestName = '老王';
}
Foo.prototype.lastName = 'wang'; function Son() {
this.firstName = '小王';
} Son.prototype = new Foo();
Son.prototype.constrotur = Son; var xw = new Son();
console.log(xw.firstName);
console.log(xw.lastName);
console.log(xw.constrotur);
利用空的函数的prototype 实现继承
function extend(parent, child) {
var F = function(){};
F.prototype = parent.prototype;
child.prototype = new F();
child.prototype.constructor = child;
child.uber = parent.prototype;
}
拷贝继承 就是把parent.protype 上的属性 遍历拷贝到 child 的protype上
function copy(parent, child) {
var p = parent.prototype;
var c = child.prototype;
for (var pro in p) {
c[pro] = p[pro]; //这里的pro是属性名!!!!是字符串形式的 所以只能用[]的形式
}
c.uber = p;
}
JavaScript(十三)面向对象的更多相关文章
- JavaScript的面向对象编程(OOP)(一)——类
在学习JavaScript面向对象的编程之前,需要知道,并了解面向对象的一些基本的常识.初学者中大多数都以为面向对象中,面向对象的编程是很重要和占据很大一部分精力.笔者在之前也是认为OOP是面向对象的 ...
- javascript进阶——面向对象特性
面向对象的javascript是这门语言被设计出来时就考虑的问题,熟悉OOP编程的概念后,学习不同的语言都会发现不同语言的实现是不同的,javascript的面向对象特性与其他具有面向对象特性的语言的 ...
- javascript的面向对象详解
每次说到javascript到面向对象,总感觉自己心里懂,但是却不知道该怎么说,这就是似懂非懂到表现,于是乎,每次一说,就要到处去查找资料,零零碎碎到看了一些,感觉有懂了,但是过段时间,好像又不知道是 ...
- 浅谈JavaScript的面向对象程序设计(四)
本文继续讲解JavaScript的面向对象程序设计.继承是面向对象语言中的一个基本概念,面向对象语言支持两种继承实现方式:接口继承和实现继承.接口继承只继承方法签名,而实现继承则继承实际的方法.但是在 ...
- JavaScript的面向对象原理之原型链详解
一.引言 在16年的10月份,在校内双选会找前端实习的时候,hr问了一个问题:JavaScript的面向对象理解吗?我张口就说“JavaScript是基于原型的!”.然后就没什么好说的了,hr可能不知 ...
- 从 prototype.js 深入学习 javascript 的面向对象特性
从 prototype.js 深入学习 javascript 的面向对象特性 js是一门很强大的语言,灵活,方便. 目前我接触到的语言当中,从语法角度上讲,只有 Ruby 比它更爽. 不过我接触的动态 ...
- javascript 的面向对象特性参考
最近在看用javascript+css实现rich client.javascript 也是一个蛮有意思的语言.特别是其面向对象的实现和其他“标准”的OO launguage有很大的不同.但是,都是动 ...
- JavaScript高级 面向对象(5)--内存逻辑图画法
说明(2017.3.30): 1. 使用软件diagram designer,DiagramDesignerSetup1.28.zip,很小只有1M多,我用的自带画图软件.教学视频是“JavaScri ...
- javascript中面向对象的5种写法
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- (一)我的Javascript系列:Javascript的面向对象旅程(上)
今宵酒醒何处,杨柳岸,晓风残月 导引 我的JavaScript系列文章是我自己对JavaScript语言的感悟所撰写的系列文章.现在还没有写完.目前一共出了下面的系列: (三)我的JavaScript ...
随机推荐
- Ubuntu 16.04中XMind 8导致Java内存溢出的问题解决(硬盘卡死,桌面卡死)
XMind使用的是Java进行开发,如果出现内存溢出的问题,那么一定是桌面快捷方式的问题,解决方法是直接修改快捷方式里面的内容,修改如下: [Desktop Entry] Encoding=UTF-8 ...
- 奥多朗WIFI 插座
https://aoduolang.tmall.com/category-1089563810.htm?spm=a1z10.1-b.w11212542-12917613245.12.tTWFSc&am ...
- java.lang.RuntimeException: JPedal Trial has now expired
具体提示: java.lang.RuntimeException: JPedal Trial has now expired jpedal-server-trial.jar jar包过期了,jpeda ...
- Python学习系列之装饰器
装饰器的作用 装饰器用于装饰某个函数.方法或者类,它可以让这个函数执行之前或者执行之后做一些操作 手工实现一个装饰器 def outer(some_func): #装饰器 $1 def inner() ...
- 慎用Outline ,UGUI Outline实现原理分析
使用 UGUI 制作背包的时候.同事发现假设背包中加入了大量的物品.比方两百个.Unity就会出错,提示 Canvas element contains more than 65535 vertice ...
- 工作总结 2018-4-13 bootstrapTable 属性 queryParams: queryParams,//参数 get 中 %5B%5D 数组的意思
<table id="dataTable" data-toggle="table" data-show-columns="true" ...
- C#.NEt-GDI+中的Pen測试
using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; usin ...
- OBIEE开发手冊
Creating a Repository Using the Oracle BI 11g Administration Tool cid=5690&ssid=0">http: ...
- 南阳oj 语言入门 A+B paoblem 题目477 题目844
A+Bproblem 题目844 两个数字翻转后相加 比方10+12 翻转后01+21=22 #include<stdio.h> int main() { int ji(in ...
- 关于The hierarchy of the type TestBeforeAdvice is inconsistent的问题
今天准备写一个spring aop的demo,创建了TestBeforeAdvice类,该类实现了MethodBeforeAdvice接口,eclipse报了"The hierarchy o ...