<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1"> <script> // 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(); //undefined 在运动 // // 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); </script> </head>
<body> </body>
</html>

es5中类与继承的更多相关文章

  1. typescript中类的继承

    typescript中类的继承用到的是:extends和super 先看一下typescript中类的写法: class Demo{ //类的属性 name:string; age:number; / ...

  2. python中类的继承

    python中类的继承 在python中面向对象编程中实现继承,以下面一个实例进行说明. class SchoolMenber(): # __init__类似于c++中的构造函数 # __init__ ...

  3. Java中类的继承,属性和方法的四种修饰符的作用范围,final关键字,java的三大特点中的2个:封装和多态,以及多态的一个设计模式,模板方法模式(template method)

    (一)Java中的继承: 关于继承,在Java中类的继承只能是单继承,不像C+++那样灵活,可以多继承,多继承的后果就是各种关系乱套,就相当于一个孩子有2个母亲一样,社会关系的复杂,不利于程序后期的开 ...

  4. 彻底理解什么是原型链,prototype和__proto__的区别以及es5中的继承

    再讲一遍好了( 参考https://blog.csdn.net/cc18868876837/article/details/81211729 https://blog.csdn.net/lc23742 ...

  5. es5与es6继承思考

    es5与es6继承思考 es6继承 class Father{ constructor(name){ this.name = name; } getName(){ console.log(this.n ...

  6. 浅谈ES5和ES6继承和区别

    最近想在重新学下ES6,所以就把自己学到的,记录下加强下自己的理解 首先先简单的聊下ES5和ES6中的继承 1.在es5中的继承: function parent(a,b){ this a = a; ...

  7. ES6中的类继承和ES5中的继承模式详解

    1.ES5中的继承模式 我们先看ES5中的继承. 既然要实现继承,首先我们得要有一个父类. Animal.prototype.eat = function(food) { console.log(th ...

  8. Java中类的继承深入剖析

    在Java开发中,我们常常用到继承这一概念,可以说继承是Java这类面向对象编程语言的基石.正是有了继承这个概念,使得我们可以创建分等级层次的类.今天小编就和大家一起来深入聊聊Java语言的继承. 在 ...

  9. 《挑战30天C++入门极限》图例实解:C++中类的继承特性

        图例实解:C++中类的继承特性 整个c++程序设计全面围绕面向对象的方式进行,类的继承特性是c++的一个非常非常重要的机制,继承特性可以使一个新类获得其父类的操作和数据结构,程序员只需在新类中 ...

随机推荐

  1. linux 变量定义

    本地变量:用户自定义的变量. 环境变量:用于所有用户变量,用于用户进程前,必须用export命令导出. 位置变量:$0(脚本名),$1-$9:脚本参数. 特定变量:脚本运行时的一些相关信息. $# 传 ...

  2. HTTP长连接、短连接究竟

    HTTP长连接.短连接究竟是什么?   1. HTTP协议与TCP/IP协议的关系 HTTP的长连接和短连接本质上是TCP长连接和短连接.HTTP属于应用层协议,在传输层使用TCP协议,在网络层使用I ...

  3. PHP用curl发送get post put delete patch请求

    function getUrl($url){ $headerArray = array("Content-type:application/json;", "Accept ...

  4. try catch 用法实例

  5. Node。js 访问gmail

    参考: https://developers.google.com/gmail/api/quickstart/nodejs step 1,在google网站上打开gmail api,下载JSOn st ...

  6. dojo DataGrid实现表格数据编辑的解决方案

    在官网上看见的DataGrid编辑非常简单,但我实现的时候总是出现问题.经过N久的摸索,终于搞定了,期间出现了多处困难,下面说些解决办法的流程. 我实现的表格在页面加载时是不显示数据,只有通过表单像服 ...

  7. tornado 笔记

    简单比较Django和Tornado Django是走大而全的方向,注重的是高效开发,最出名的是全自动化管理后台 Tornado走的是少而精的方向,注重的是性能的优化,最出名的是异步非堵塞 安装方式: ...

  8. IText简介及示例

    一.iText简介 iText是著名的开放源码的站点sourceforge一个项目,是用于生成PDF文档的一个java类库.通过iText不仅可以生成PDF或rtf的文档,而且可以将XML.Html文 ...

  9. Spring Cloud(Dalston.SR5)--Eureka 服务实例健康检查

    默认情况下,Eureka 客户端每隔 30 秒会发送一次心跳给服务器端,告知正常存活,但是,实际环境中有可能出现这种情况,客户端表面上可以正常发送心跳,但实际上服务是不可用的,例如,一个需要访问数据的 ...

  10. 编译小米mini openwrt

    编译小米mini openwrt 1.下载openwrt源码包:进入要下载保存的文件目录,输入 git clone git://git.openwrt.org/15.05/openwrt.git 2. ...