Es5中的类和静态方法 继承(原型链继承、对象冒充继承、原型链+对象冒充组合继承)

// es5里面的类  

//1.最简单的类
// function Person(){
// this.name='张三';
// this.age=20;
// }
// var p=new Person();
// alert(p.name); //2、构造函数和原型链里面增加方法
// function Person(){
// this.name='张三'; /*属性*/
// this.age=20;
// this.run=function(){
// alert(this.name+'在运动');
// }
// }
// //原型链上面的属性会被多个实例共享 构造函数不会
// Person.prototype.sex="男";
// Person.prototype.work=function(){
// alert(this.name+'在工作');
// }
// var p=new Person();
// // alert(p.name);
// // p.run();
// p.work(); //3类里面的静态方法
// function Person(){
// this.name='张三'; /*属性*/
// this.age=20;
// this.run=function(){ /*实例方法*/
// alert(this.name+'在运动');
// }
// } // Person.getInfo=function(){
// alert('我是静态方法');
// }
// //原型链上面的属性会被多个实例共享 构造函数不会
// Person.prototype.sex="男";
// Person.prototype.work=function(){
// alert(this.name+'在工作');
// }
// var p=new Person();
// p.work();
// //调用静态方法
// Person.getInfo(); // 4、es5里面的继承 对象冒充实现继承
// function Person(){
// this.name='张三'; /*属性*/
// this.age=20;
// this.run=function(){ /*实例方法*/
// alert(this.name+'在运动');
// }
// }
// Person.prototype.sex="男";
// Person.prototype.work=function(){
// alert(this.name+'在工作');
// }
// //Web类 继承Person类 原型链+对象冒充的组合继承模式
// function Web(){
// Person.call(this); /*对象冒充实现继承*/
// }
// var w=new Web();
// // w.run(); //对象冒充可以继承构造函数里面的属性和方法
// w.work(); //对象冒充可以继承构造函数里面的属性和方法 但是没法继承原型链上面的属性和方法 // 5、es5里面的继承 原型链实现继承
// function Person(){
// this.name='张三'; /*属性*/
// this.age=20;
// this.run=function(){ /*实例方法*/
// alert(this.name+'在运动');
// }
// }
// Person.prototype.sex="男";
// Person.prototype.work=function(){
// alert(this.name+'在工作');
// }
// //Web类 继承Person类 原型链+对象冒充的组合继承模式
// function Web(){
// }
// Web.prototype=new Person(); //原型链实现继承
// var w=new Web();
// //原型链实现继承:可以继承构造函数里面的属性和方法 也可以继承原型链上面的属性和方法
// //w.run();
// w.work(); // 6、 原型链实现继承的 问题?
// function Person(name,age){
// this.name=name; /*属性*/
// this.age=age;
// this.run=function(){ /*实例方法*/
// alert(this.name+'在运动');
// }
// }
// Person.prototype.sex="男";
// Person.prototype.work=function(){
// alert(this.name+'在工作');
// }
// var p=new Person('李四',20);
// p.run(); // function Person(name,age){
// this.name=name; /*属性*/
// this.age=age;
// this.run=function(){ /*实例方法*/
// alert(this.name+'在运动');
// }
// }
// Person.prototype.sex="男";
// Person.prototype.work=function(){
// alert(this.name+'在工作');
// } // function Web(name,age){
// } // Web.prototype=new Person();
// var w=new Web('赵四',20); //实例化子类的时候没法给父类传参
// w.run();
// // var w1=new Web('王五',22); //7.原型链+对象冒充的组合继承模式
// function Person(name,age){
// this.name=name; /*属性*/
// this.age=age;
// this.run=function(){ /*实例方法*/
// alert(this.name+'在运动');
// }
// }
// Person.prototype.sex="男";
// Person.prototype.work=function(){
// alert(this.name+'在工作');
// } // function Web(name,age){
// Person.call(this,name,age); //对象冒充继承 实例化子类可以给父类传参
// }
// Web.prototype=new Person();
// var w=new Web('赵四',20); //实例化子类的时候没法给父类传参
// // w.run();
// w.work();
// // var w1=new Web('王五',22); //8、原型链+对象冒充继承的另一种方式
function Person(name, age) {
this.name = name; /*属性*/
this.age = age;
this.run = function () { /*实例方法*/
alert(this.name + '在运动');
}
}
Person.prototype.sex = "男";
Person.prototype.work = function () {
alert(this.name + '在工作');
}
function Web(name, age) {
Person.call(this, name, age); //对象冒充继承 可以继承构造函数里面的属性和方法、实例化子类可以给父类传参
}
Web.prototype = Person.prototype;
var w = new Web('赵四', 20); //实例化子类的时候没法给父类传参
w.run();
// w.work();
// var w1=new Web('王五',22);

Es5中的类和静态方法 继承的更多相关文章

  1. Typescript中的类 Es5中的类和静态方法和继承(原型链继承、对象冒充继承、原型链+对象冒充组合继承)

    <!doctype html> <html> <head> <meta charset="utf-8"> <meta name ...

  2. koa 基础(十七)原生 JS 中的类、静态方法、继承

    1.app.js /** * 原生 JS 中的类.静态方法.继承 * es5中的类和静态方法 */ function Person(name, age) { // 构造函数里面的方法和属性 this. ...

  3. ES5中的类与继承

    最近在重新复习TypeScript,看到类这块的时候自然会和ES5中的类写法进行对比加深印象. 发现ES5的类与继承一些细节还是挺多的,时间久了容易忘记,特此记录下. 首先是ES5的类定义,这没什么好 ...

  4. koa 基础(十八)es6中的类、静态方法、继承

    1.app.js /** * es6中的类.静态方法.继承 */ // 定义Person类 class Person { constructor(name, age) { /*类的构造函数,实例化的时 ...

  5. Typescript 学习笔记四:回忆ES5 中的类

    中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...

  6. 06 (OC)* iOS中UI类之间的继承关系

    iOS中UI类之间的继承关系 此图可以更好的让你去理解iOS中一些底层的关系.你能够了解以及理解UI类之间的继承关系,你会更加明白苹果有关于底层的东西,更有助于你的项目开发由它们的底层关系,就能更加容 ...

  7. ES5中的类

    之前小编对于类和类的基本特征(所谓的封装.继承.多态)理解一直不是很到位,同时在实际项目应用中也用的比较少,今天小编就结合ES5中的基本用法和大家聊聊,希望小伙伴会在这篇文章有属于自己的收获,并能够在 ...

  8. es6中class类的静态方法、实例方法、实例属性、(静态属性)

    关于类有两个概念,1,类自身,:2,类的实例对象 总的来说:静态的是指向类自身,而不是指向实例对象,主要是归属不同,这是静态属性的核心. 难点1:静态方法的理解 class Foo { static ...

  9. 在ES5中模拟类

    1.Object.create()方法创建一个新对象,使用现有的对象来提供新创建的对象的__proto__. var _this = Object.create(fn.prototype);这句代码的 ...

随机推荐

  1. Oauth2.0[笔记]

    背景 如果资源服务器只是提供资源给自己的应用,使用帐号密码做身份认证倒没什么问题,但如果需要提供资源给第三方应用,就会出现第三方应用需要与资源服务器共享身份凭证,这时会出现几个问题: 1.第三方应用需 ...

  2. Zookeeper Health Checks

    Short Description: The article talks about the basic health checks to be performed when working on i ...

  3. Error response from daemon: rpc error: code = Unknown desc = name conflicts with

    环境:centos7 执行一下命令时, docker service create --mode global --name logspout gliderlabs/logspout 出现以下报错: ...

  4. centos7下安装docker(15.2跨主机网络-overlay)

    为支持容器跨主机通信,Docker提供了overlay driver,使用户可以创建基于VxLAN的overlay网络.VxLAN可将二层数据封装到UDP进行传输,VxLAN提供与VLAN相同的以太网 ...

  5. 微信小程序接入,https服务器搭建和调试

    在进行小程序开发时候,调试时候,希望在本地搭建一个https环境. 准备条件: 1.公网主机(阿里云或者腾讯云主机) 2外网访问工具natapp 步骤: 1.在主机上安装nginx(nginx转发到n ...

  6. WPF 格式化输出- IValueConverter接口的使用 datagrid列中的值转换显示

    以前在用ASP.NET 做B/S系统时,可以方便地在GRIDVIEW DATAList等数据控件中,使用自定义的代码逻辑,比如 使用 <%# GetBalance(custID) %> 这 ...

  7. Springboot 实现api校验和登录验证

    https://blog.csdn.net/qq_36085004/article/details/83348144 文章目录 API校验 场景 实现思路 代码 拦截器: 拦截器注册: 登录token ...

  8. Apache 项目列表功能分类便于技术选型

    big-data (49):  Apache Accumulo  Apache Airavata  Apache Ambari  Apache Apex  Apache Avro  Apache Be ...

  9. P2089 烤鸡(搜索简单题)

    题意:就是x分别是1到3的未知数,求x1+x2+x3.....+x10=n的方案数和输出每种方案.每种方案还必须按字典序输出 思路:就是简单的构建搜索树+约束条件啊,其实数据范围一点都不大,所以,我第 ...

  10. MyEclipse使用总结——设置MyEclipse开发项目时使用的JDK

    安装好MyEclipse之后,在MyEclipse中开发项目时,默认使用的是MyEclipse是自带的JDK,如下图所示: 如果我们需要使用自己安装好的JDK,那么就需要在MyEclipse中重新设置 ...