1. //定义object的继承方法
  2. Object.extend = function(destination, source) {
  3. for(property in source) {
  4. destination[property] = source[property];
  5. }
  6. return destination;
  7. }
  8. Object.prototype.extend = function(object) {
  9. return Object.extend.apply(this, [this, object]);
  10. }
  11. //声明动物类
  12. function Animail(name, age) {
  13. this.name = name;
  14. this.age = age;
  15. this.say = function() {
  16. console.log("我是:" + this.name + "--年龄:" + this.age);
  17. }
  18. }
  19. const dog = new Animail("小狗", 12);
  20. dog.say();
  21.  
  22. function Car(name, age) {
  23. //使用call实现继承Animail类
  24. // Animail.call(this, name, age);
  25. //使用apply实现继承Animail类
  26. /*Animail.apply(this, arguments);
  27. this.run = function() {
  28. console.log("车跑...")
  29. }*/
  30. this.name = name;
  31. this.age = age;
  32. }
  33. //使用object实现继承animail类
  34. Car.prototype = (new Animail).extend({
  35. //重写say方法
  36. say: function() {
  37. console.log("我是车-名称:" + this.name + "age:" + this.age);
  38. },
  39. //添加 跑方法
  40. run: function() {
  41. console.log("车running...");
  42. }
  43. });
  44. const caChe = new Car("卡车", 2);
  45. caChe.say();
  46. caChe.run();
  47.  
  48. const qiChe = new Car("汽车", 15);
  49. qiChe.say();
  50. qiChe.run();

es6 继承的实现

  1. //定义animail类
  2. class Animail {
  3. //构造函数
  4. constructor() {};
  5.  
  6. //属性的封装
  7. setName(name) {
  8. this.name = name;
  9. };
  10. getName() {
  11. return this.name;
  12. };
  13. setAge(age) {
  14. if(age > 100 || age < 1) {
  15. this.age = 1;
  16. } else {
  17. this.age = age;
  18. }
  19. };
  20. getAge() {
  21. return this.age;
  22. }
  23. //定义say的方法
  24. say() {
  25. console.log("我是:" + this.name + "--age:" + this.age);
  26. };
  27. //静态方法
  28. static sayHello() {
  29. console.log("我是静态方法!");
  30. }
  31. }
  32. //实例化dog
  33. const dog = new Animail();
  34. //设置name属性
  35. dog.setName("小狗");
  36. //设置年龄属性
  37. dog.setAge(1000);
  38. //d调用say方法
  39. dog.say();
  40. //获取属性的值
  41. console.log(dog.getName());
  42. //调用静态方法(静态方法不能被实例化对象调用)
  43. Animail.sayHello();
  44.  
  45. //继承
  46. class People extends Animail {
  47. sayHello() {
  48. console.log("大家好,我是:" + this.name + ",今年:" + this.age + "岁了!,我现在上" + this.grade + ",在" + this.className);
  49. };
  50. //年级名称
  51. setClassName(className) {
  52. this.className = className;
  53. };
  54. getClassName() {
  55. return this.className;
  56. };
  57. setGrade(gradeName) {
  58. this.grade = gradeName;
  59. };
  60. getGrade() {
  61. return this.grade;
  62. }
  63. }
  64. const xm = new People();
  65. xm.setName("小明");
  66. xm.setAge(10);
  67. xm.setClassName("二班");
  68. xm.setGrade("三年级");
  69. xm.say();
  70. xm.sayHello();

js 继承的方式的更多相关文章

  1. js继承的方式及其优缺点

    js继承方法 前因:ECMAScript不支持接口继承,只支持实现继承 一.原型链 概念:每个构造函数都有一个原型对象,原型对象都包含一个指向构造函数的指针,而实例都包含一个指向原型对象的内部指针,让 ...

  2. js继承的方式

    深入理解继承的实现方式不仅仅有利于自己去造轮子,封装插件,更有利于我们去阅读一些框架的源码, 以下记录几种常见的继承方式 1. 原型链实现继承 function Father(){ this.name ...

  3. JS继承 实现方式

    JS中继承方式的实现有多种方法,下面是比较推荐的方法,其它继承方式可做了解: function object(o) { function F() {} F.prototype = o; return ...

  4. js面向对象编程(第2版)——js继承多种方式

    附带书籍地址: js面向对象编程(第2版)

  5. JS继承的原理、方式和应用

    概要: 一.继承的原理 二.继承的几种方式 三.继承的应用场景 什么是继承? 继承:子类可以使用父类的所有功能,并且对这些功能进行扩展.继承的过程,就是从一般到特殊的过程.要了解JS继承必须首先要了解 ...

  6. JS类继承常用方式发展史

    JS类继承常用方式发展史 涉及知识点 构造函数方式继承 1-继承单个对象 1.1 多步走初始版 1.2 多步走优化版 1.3 Object.create()方式 2-继承多个对象 2.1 遍历 Obj ...

  7. JS继承以及继承的几种实现方式总结

    传统面向对象语言:继承是类与类之间的关系. 而在js中由于es6之前没有类的概念,所以继承是对象与对象之间的关系. 在js中,继承就是指使一个对象有权去访问另一个对象的能力. 比如:比如对象a能够访问 ...

  8. js 继承的几种方式

    JS继承的实现方式: 既然要实现继承,那么首先我们得有一个父类,代码如下: function Animal(name) { // 属性 this.name = name || '小白'; // 实例方 ...

  9. js对象的几种创建方式和js实现继承的方式[转]

    一.js对象的创建方式 1. 使用Object构造函数来创建一个对象,下面代码创建了一个person对象,并用两种方式打印出了Name的属性值. var person = new Object(); ...

随机推荐

  1. 安全测试2_Web前端知识学习

    上次讲到安全的简介,这次就来简单的学习下基本的前端知识(html.js.css(不作讲解),牛逼的请忽略!!! 1.Html简单概述: Html和Html DOM 2.Html字符实体(借用别人的,详 ...

  2. Vue.js模拟百度下拉框

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. Hive 优化汇总

    参考: http://www.cnblogs.com/yshb/p/3147710.html http://www.cnblogs.com/sandbank/p/6408762.html 一   jo ...

  4. iOS基础知识之属性及属性关键字

    iOS属性及属性关键字 一.属性功能:1.给现有的成员变量生成一对setter/getter方法.2.如果没有声明成员变量,自动声明一个_属性名的私有变量(默认的成员变量是受保护的). 二.属性关键字 ...

  5. filter map reduce函数的使用

    #filter("处理逻辑","可迭代对象") 把可迭代对象依次处理逻辑处理,如果值为真就返回值,值为假就不返回; li = ['testA','yerA',' ...

  6. golang 的 mysql 操作

    goLang的mysql操作,大致可分为三个步骤: 1.下载mysql驱动:go get github.com/go-sql-driver/mysql 2.建立连接:sql.Open("my ...

  7. 解决 shopnc b2b2c 版权问题 修改路经ULR及目录文件夹思路及教程

    相信各位使用过NC的朋友,多多少少收到过律师函,把一堆人吓尿了,原因你使用了盗版,大哥都要吃饭可以理解#网络那么大,他怎么能快速定位到您的,原因很简单 搜索引擎,NC在开发中定义了URL路由规则,在百 ...

  8. HTTP梳理

    HTTP请求头 Host:初始URL中的主机名和端口 Accept:浏览器可接受的MIME类型 Acceept-Charset:浏览器接受的字符集 Accept-Encoding:浏览器能够进行解码的 ...

  9. jquery接触初级-----ajax 之:load()方法

    jquery _ajax 请求主要有几种方式:load(),$.get(),$.post(),$.ajax(),$.getScript(),$.getJson() 1.load()方法 格式:load ...

  10. AS_简单的开始

    1.注释   单行注释  //           多行注释  /* src */ 2.变量   变量名,可以包含字母.数字.下划线.$.但不以数字开头.   变量类型,是严格数据类型.AS有静态类型 ...