js 类继承extends
先看例子:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script type="text/javascript">
class map{
print(data){
alert(data)
}
}
class child extends map{
constructor(opt){
super()
this.init(opt)
}
init(opt){
this.data=Object.assign({}, opt);
console.log(this.data.a)
this.print(this.data.a)
}
}
let data={
a:'1',
b:'2'
}
new child(data);
</script>
</body>
</html>
map类里边是一些可复用的方法集中放在一起,它可以衍生出很多子类,它本身是很多子类的交集。例子中的child在实例化的时候传入数据就是先传入constructor,但是里边要有super(),每个方法直接不要有逗号。
有时候项目中可能不需要继承,仅仅是在一个js文件中生成一个类,然后被其他js文件引用并且new实例化,那么可以写成如下:
class map{
constructor(opt){
this.init(opt)
}
init(opt){
this.data=Object.assign({}, opt);
console.log(this.data.a)
alert(this.data.a)
}
}
let data={
a:'1',
b:'2'
}
new map(data);
再啰嗦下,有时候一个对象是
var name = "The Window";
var object = {
name: "My Object",
getNameFunc: function() {
var that = this;
returnfunction() {
return that.name;
};
}
};
alert(object.getNameFunc()()); //"My Object"
这种写法仅仅是定义一个对象,其中属性和方法之间用逗号隔开,如果是定义类的话那么不能用逗号隔开,两者很像,要注意区分。
js 类继承extends的更多相关文章
- Js 类继承 extends
html 及 js 代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&q ...
- JS类继承常用方式发展史
JS类继承常用方式发展史 涉及知识点 构造函数方式继承 1-继承单个对象 1.1 多步走初始版 1.2 多步走优化版 1.3 Object.create()方式 2-继承多个对象 2.1 遍历 Obj ...
- 128-PHP类继承extends
<?php class father{ //定义father类 //定义public描述的成员属性和方法 public $eyes=2; public $ears=2; public funct ...
- js类继承扩展super
相应的资料https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/super 例子: class Pol ...
- JS原型继承和类式继承
前言 一个多月前,卤煮读了一篇翻译过来的外国人写的技术博客.此君在博客中将js中的类(构造)继承和原型继承做了一些比较,并且得出了结论:建议诸位在开发是用原型继承.文中提到了各种原型继承的优点,详细的 ...
- js类(继承)(二)
1. 定义js类 js并不是一种面向对向的语言, 没有提供对类的支持, 因此我们不能像在传统的语言里那样 用class来定义类, 但我们可以利用js的闭包封装机制来实现js类, 我们来封装一个简的Sh ...
- 《JS权威指南学习总结--9.3 JS中JAVA式的类继承》
内容要点: 一.JS中的类 1.JAVA或其他类似强类型 面向对象语言的 类成员的模样 实例字段:它们是基于实例的属性或变量,用以保存独立对象的状态. 实例方法: 它们是类的所有实例所共享的方法,由每 ...
- js原生继承之——类式继承实例(推荐使用)
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8&qu ...
- JS原型继承与类的继承
我们先看JS类的继承 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> &l ...
随机推荐
- requests库的学习——跟随官方文档
发送GET请求: import requests r=requests.get("http://www.kekenet.com/") 如果需要传递参数可以有以下几种方法: impo ...
- LCD驱动分析(二)帧缓冲设备作为平台设备
参考:S3C2440 LCD驱动(FrameBuffer)实例开发<一> S3C2440 LCD驱动(FrameBuffer)实例开发<二> 1.平台设备注册 1.1在li ...
- cdev结构体
在内核源码include/linux/cdev.h里对cdev结构体的定义: struct cdev { struct kobject kobj; // 内嵌的kobject对象 struct mo ...
- Java面试——从JVM角度比较equals和==的区别
1. Java中数据类型分类 1.1 基本数据类型 又称为原始数据类型,byte,short,char,int,long,float,double,boolean,他们之间的比较应该使用(== ...
- hadoop学习爬坑记录
1. Q: hdfs管理界面50070端口设置后,无法访问情况. A: 1)停止当前所有服务./stop-all.sh 2)在hdfs-site.xml中,更改开放端口的绑定IP: <prope ...
- 【03】图解原型和原型链by魔芋
[03]图解原型和原型链 一图胜前言 请先结合图解原型和原型链这张图. 可以分为4种情况. 情况1: Object有: constructor:是Function. __pro ...
- 洛谷P3312 - [SDOI2014]数表
Portal Solution 共\(T(T\leq2\times10^4)\)组测试数据.给出\(n,m(n,m\leq10^5),a(a\leq10^9)\),求\[ \sum_{i=1}^n\s ...
- K-lord #1
Memories 布雷芙,和YYJ就那样在那个初夏相遇了. 她,一头蓬松的长发,简单可爱的短袖. 他,带着那么灿烂阳光的笑容. 于是一切就变得很微妙.眼神有了温度手心有了潮湿. 那些天空里匆忙盛开的夏 ...
- 【2018.9.20】JOI 2017 Final T3「JOIOI 王国 / The Kingdom of JOIOI」
题目链接 题目描述 JOIOI 王国是一个 $H$ 行 $W$ 列的长方形网格,每个 $1\times 1$ 的子网格都是一个正方形的小区块.为了提高管理效率,我们决定把整个国家划分成两个省 $JOI ...
- spring aop在mvc的controller中加入切面无效
spring aop在mvc的controller中加入切面无效 因为MVC的controller,aop默认使用jdk代理.要使用cglib代理. 在spring-mybatis.xml配置文件中加 ...