JS中的类,类的继承方法
大牛请无视此篇!
首先我们定义一个类,方法很简单,就像我们定义函数一样,只不过我们为了与函数区分,名称首字母要大写,看代码:
function Person (){ }
这就是一个很简单的Poson类,然后我们通过类来进行实例化对象,通俗的说创建对象吧,我们以前用过的json对象,和我们现在要用的标准对象
//简单的json对象(此对象与Person类没任何关系,只是让大家观察两者的写法区别)
var obj = {
name:‘lemon’,
age:'18'
}
//通过Person来实例化一个对象(对象名称相同为了对比)
var obj = new Person; //定义对象属性
obj.name = 'lemon'
//定义对象方法
obj.fn = function(){
console.log('www.lemon-x.ml')
};
//类是无法使用对象中的属性和方法的、对象也是无法使用类的方法和属性的
console.log(obj.name);
obj.fn();
//定义对象属性以及方法
Person.num = 1;
Person.fn = function(){
console.log('我是类方法')
}
//进行调用
console.log(Person.num);
Person.fn(); //我们可以通过prototype可以给这个类下面的所有对象添加一个共有的属性或方法
Person.prototype.age = 18;
Person.prototype.data = function(){
console.log(this.name+':'+this.age)
};
console.log(obj.age);
obj.data();
话不多说,看下第一种继承方法,通过拓展Object来实现继承
//父类
function Parent(add,net,no,teacher) {
this.add = add;
this.net = net;
this.no = no;
this.teacher = teacher;
}
//子类
function Child(name,age,sex,id) {
this.name = name;
this.sex = sex;
this.age = age;
this.id = id;
}
/*继承方法*/
Object.prototype.extend = function(ParentObj){
for(var i in ParentObj){
this[i] = ParentObj[i]
}
};
/*实例化子类,实例化父类,子类调用继承方法*/
var parent = new Parent(
"china","www.lemon-x.ml","1608","ccy"
);
var child = new Child("lemon","男","18","1001");
//调用我们写好的继承方法
child.extend(parent);
//现在我们就可以调用父类中的属性以及方法了
console.log(child.add); //如果看不懂看下面这个简单的
//父类
function Parent(add) {
this.add = add; }
//子类
function Child() { }
/*继承方法*/
Object.prototype.extend = function(ParentObj){
for(var i in ParentObj){
this[i] = ParentObj[i]
}
};
/*实例化子类,实例化父类,子类调用继承方法*/
var parent = new Parent("china");
var child = new Child();
//调用我们写好的继承方法
child.extend(parent);
//现在我们就可以调用父类中的属性以及方法了
console.log(child.add);
通过call 或 apply 来实现继承
//call 无参
function Person(){
this.name = 'lemon';
this.age = '18';
}
function show(){
alert(this.name+':'+this.age);
}
var p = new Person;
//通过call方法使show方法中的this指向p对象
show.call(p); //call有参
function Person2(){
this.name = 'lemon';
this.age = '18';
}
function show2(id,add){
alert(this.name+':'+this.age+','+id+','+add);
}
var p2 = new Person2;
//通过call方法使show方法中的this指向p对象
show2.call(p2,'001','山东'); //apply 无参
function Person3(){
this.name = 'lemon';
this.age = '18';
}
function show3(){
alert('apply无参:'+this.name+':'+this.age);
}
var p3 = new Person3;
//通过apply方法使show方法中的this指向p对象
show3.apply(p3); //apply有参
function Person4(){
this.name = 'lemon';
this.age = '18';
}
function show4(id,add){
alert('apply有参'+this.name+':'+this.age+','+id+','+add);
}
var p4 = new Person4;
//通过apply方法使show方法中的this指向p对象
show4.apply(p4,['001','山东']); /*通过call apply实现继承*/
//父类
function Parent(add,net,no,teacher) {
this.add = add;
this.net = net;
this.no = no;
this.teacher = teacher;
}
//子类
function Child(name,age,sex,id) {
this.name = name;
this.sex = sex;
this.age = age;
this.id = id;
//Parent.call(this,'山东','www.lemon-x.ml','001','ccy');
Parent.apply(this,['山东','www.lemon-x.ml','001','ccy']);
}
var child = new Child('lemon','18','man','002');
console.log(child.net);
JS中的类,类的继承方法的更多相关文章
- JS中常见的几种继承方法
1.原型链继承 // 1.原型链继承 /* 缺点:所有属性被共享,而且不能传递参数 */ function Person(name,age){ this.name = name this.age = ...
- js中判断数据类型的四种方法总结
js中判断数据类型的四种方法 前言 在js中,我们经常需要判断数据的类型,那么哪些方法可以用来判断数据的类型呢?哪种方法判断数据类型最准确呢? 我们来一个个分析: 1.typeof typeof是一个 ...
- js中style.display=""无效的解决方法
本文实例讲述了js中style.display=""无效的解决方法.分享给大家供大家参考.具体解决方法如下: 一.问题描述: 在js中我们有时想动态的控制一个div显示或隐藏或更多 ...
- js中数组去重的几种方法
js中数组去重的几种方法 1.遍历数组,一一比较,比较到相同的就删除后面的 function unique(arr){ ...
- JS 中深拷贝的几种实现方法
JS 中深拷贝的几种实现方法1.使用递归的方式实现深拷贝 //使用递归的方式实现数组.对象的深拷贝 function deepClone1(obj) { //判断拷贝的要进行深拷贝的是数组还是对象,是 ...
- js中的splice方法和slice方法简单总结
slice:是截取用的 splice:是做删除 插入 替换用的 slice(start,end): 参数: start:开始位置的索引 end:结束位置的索引(但不包含该索引位置的元素) 例如: va ...
- 用Java开发一个工具类,提供似于js中eval函数功能的eval方法
今天在看到<Java疯狂讲义>中一个章节习题: 开发一个工具类,该工具类提供一个eval()方法,实现JavaScript中eval()函数的功能--可以动态运行一行或多行程序代码.例如: ...
- Js中数据类型判断的几种方法
判断js中的数据类型有一下几种方法:typeof.instanceof. constructor. prototype. $.type()/jquery.type(),接下来主要比较一下这几种方法的异 ...
- 判断js中的数据类型的几种方法
判断js中的数据类型有一下几种方法:typeof.instanceof. constructor. prototype. $.type()/jquery.type(),接下来主要比较一下这几种方法的异 ...
- 转:判断js中的数据类型的几种方法
判断js中的数据类型有一下几种方法:typeof.instanceof. constructor. prototype. $.type()/jquery.type(),接下来主要比较一下这几种方法的异 ...
随机推荐
- PHP常用函数(收集)
<?php //===============================时间日期=============================== //y返回年最后两位,Y年四位数,m月份数字 ...
- iOS 开发 之 编程知识点
iOS 创建和设置pch iOS 之 时间格式与字符串转换 iOS 之 二维码生成与扫描(LBXScan) iOS 之 定时器 iOS 之 通知 iOS 之 NSString 去除前后空格和回车键 i ...
- 2.14. 删除托管对象(Core Data 应用程序实践指南)
删除托管对象,只要调用托管对象上下文的deleteObject 或 deleteObjects就可以了.同样,真正的删除,要在调用save:之后.
- C-Sharp网络编程案例解析(Socket类的使用)
Server端: using System; using System.Collections.Generic; using System.Text; using System.Net; using ...
- js模块化开发——require.js的实战写法1
关于在Require.js使用一个JS插件的问题 我需要在项目中引用一个js控件,这个控件依赖于a.js,b.js,c.js,.....n.js N多个js以及jquery及jquery-ui,各js ...
- C的memcpy和strcpy的区别
strcpy是拷贝字符串,以\0为标志结束(即一旦遇到数据值为0的内存地址拷贝过程即停止) strcpy的原型为 char *strcpy(char *dest, const char *src) 而 ...
- JS插件库
http://www.cnblogs.com/xiaoyao2011/category/327551.html
- 如何编译POCO
Poco C++库是: 一系列C++类库,类似Java类库,.Net框架,Apple的Cocoa; 侧重于互联网时代的网络应用程序 使用高效的,现代的标准ANSI/ISO C++,并基于STL 高可移 ...
- 树莓派VNC搭建相关问题,啦啦啦~
为了节省money,于是我决定用VNC界面来代替显示器,为后面做C++ Qt以及Python Qt开发打下基础,我别无选择!下面开始进入正题: 1-- 下载VNC-Viewer-6.0.1-Windo ...
- Weex系列一、构建Weex工程
Weex比React Native更简单,更容易学习,并且做到真正的跨平台,一套代码可以多个平台运行.所以建议大家都用Weex吧. 一.安装Node 已经安装Node的,请忽略过去. 检查Node是否 ...