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 ...
随机推荐
- opencv中相关的矩阵运算
一.矩阵Mat I,img,I1,I2,dst,A,B;double k,alpha;Scalar s;1.加法I=I1+I2;//等同add(I1,I2,I);add(I1,I2,dst,mask, ...
- 和为s的两个数字 和为s的连续正数序列
输入一个递增排序的数组和一个数字s,在数组中查找两个数,使得它们的和正好是s,如果有多对数字的和等于s,输出任意一对即可. #include <iostream> using namesp ...
- 树形 dp
// ACM训练联盟周赛 C. Teemo's tree problem There is an apple tree in Teemo's yard. It contains n nodes ...
- python库——h5py入门讲解
本文只是简单的对h5py库的基本创建文件,数据集和读取数据的方式进行介绍,作者刚接触h5py,完全靠看文档自学,如果哪里说的不对,欢迎纠正!如果读者需要进一步详细的学习h5py的更多知识,请参考h5p ...
- iOS 引入支付宝 缺少 #include <openssl/asn1.h>
出现情况如上图: 解决方法如下:在你的Xcode里的header search paths 里添加支付宝SDK(openssl的路径):格式如下 $(PROJECT_DIR)/文件夹名 ...
- POJ-3481 Double Queue,Treap树和set花式水过！
Double Queue 本打算学二叉树,单纯的二叉树感觉也就那几种遍历了, 无意中看到了这个题,然后就 ...
- 【Luogu】P3381最小费用最大流模板（SPFA找增广路）
题目链接 哈 学会最小费用最大流啦 思路是这样. 首先我们有一个贪心策略.如果我们每次找到单位费用和最短的一条增广路,那么显然我们可以把这条路添加到已有的流量里去——不管这条路的流量是多大,反正它能 ...
- BZOJ-1303 中位数图
先找到B的位置x,然后依次统计A[i..x-1](0<i<x)中小于B的个数,和A[x+1..i](x<i<n)中大于B的个数 最后Answer等于(左边有i个小于B的情况总数 ...
- 3931: [CQOI2015]网络吞吐量【网络流】
网络吞吐量(network)题目描述路由是指通过计算机网络把信息从源地址传输到目的地址的活动,也是计算机网络设计中的重点和难点.网络中实现路由转发的硬件设备称为路由器.为了使数据包最快的到达目的地,路 ...
- 【kmp+最小循环节】poj 2406 Power Strings
http://poj.org/problem?id=2406 [题意] 给定字符串s,s=a^n,a是s的子串,求n最大是多少 [思路] kmp中的next数组求最小循环节的应用 例如 ababab ...