大牛请无视此篇!

首先我们定义一个类,方法很简单,就像我们定义函数一样,只不过我们为了与函数区分,名称首字母要大写,看代码:

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中的类,类的继承方法的更多相关文章

  1. JS中常见的几种继承方法

    1.原型链继承 // 1.原型链继承 /* 缺点:所有属性被共享,而且不能传递参数 */ function Person(name,age){ this.name = name this.age = ...

  2. js中判断数据类型的四种方法总结

    js中判断数据类型的四种方法 前言 在js中,我们经常需要判断数据的类型,那么哪些方法可以用来判断数据的类型呢?哪种方法判断数据类型最准确呢? 我们来一个个分析: 1.typeof typeof是一个 ...

  3. js中style.display=""无效的解决方法

    本文实例讲述了js中style.display=""无效的解决方法.分享给大家供大家参考.具体解决方法如下: 一.问题描述: 在js中我们有时想动态的控制一个div显示或隐藏或更多 ...

  4. js中数组去重的几种方法

    js中数组去重的几种方法         1.遍历数组,一一比较,比较到相同的就删除后面的                 function unique(arr){                 ...

  5. JS 中深拷贝的几种实现方法

    JS 中深拷贝的几种实现方法1.使用递归的方式实现深拷贝 //使用递归的方式实现数组.对象的深拷贝 function deepClone1(obj) { //判断拷贝的要进行深拷贝的是数组还是对象,是 ...

  6. js中的splice方法和slice方法简单总结

    slice:是截取用的 splice:是做删除 插入 替换用的 slice(start,end): 参数: start:开始位置的索引 end:结束位置的索引(但不包含该索引位置的元素) 例如: va ...

  7. 用Java开发一个工具类,提供似于js中eval函数功能的eval方法

    今天在看到<Java疯狂讲义>中一个章节习题: 开发一个工具类,该工具类提供一个eval()方法,实现JavaScript中eval()函数的功能--可以动态运行一行或多行程序代码.例如: ...

  8. Js中数据类型判断的几种方法

    判断js中的数据类型有一下几种方法:typeof.instanceof. constructor. prototype. $.type()/jquery.type(),接下来主要比较一下这几种方法的异 ...

  9. 判断js中的数据类型的几种方法

    判断js中的数据类型有一下几种方法:typeof.instanceof. constructor. prototype. $.type()/jquery.type(),接下来主要比较一下这几种方法的异 ...

  10. 转:判断js中的数据类型的几种方法

    判断js中的数据类型有一下几种方法:typeof.instanceof. constructor. prototype. $.type()/jquery.type(),接下来主要比较一下这几种方法的异 ...

随机推荐

  1. Variation of e.touches, e.targetTouches and e.changedTouches

    We have the following lists: touches: A list of information for every finger currently touching the ...

  2. MindManager 安装注册

    正版现在998元,对于个人用户来说是不是太贵了.直接下载的还不能打开,挺奇怪.

  3. logback的日志配置文件

    日志配置文件logback.xml: <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE con ...

  4. $(function(){})和$(document).ready(function(){}) 的区别

    document.ready和onload的区别——JavaScript文档加载完成事件 页面加载完成有两种事件 一是ready,表示文档结构已经加载完成(不包含图片等非文字媒体文件) 二是onloa ...

  5. iOS网络高级编程:iPhone和iPad的企业应用开发(书籍学习)

    作者:Jack Cox.Nathan Jones.John Szumski 译者:张龙  勘误  前言  第 I 部分 理解iOS与企业网络 这一部分从高层次概览了iOS网络以及针对移动网络架构的最佳 ...

  6. 一个完整的PHP类包含的七种语法说明

    类中的七种语法说明 -属性 -静态属性 -方法 -静态方法 -类常量 -构造函数 -析构函数 <?php class Student { // 类里的属性.方法和函数的访问权限有 (函数和方法是 ...

  7. 10款面向HTML5 画布(Canvas)的JavaScript库

    https://www-evget-com/article/2014/4/9/20799.html

  8. Windows Server 2008 R2 允许远程桌面连接这台计算机是灰色解决办法

    发现在给"远程协助"打钩时,是灰色的没法钩上,也就没办法开启.这是因为Windows Server 2008 R2的安全性已经被微软设计的很高,默认刚安装上Windows Serv ...

  9. Windows Server 2008 R2防火墙出站规则

    出战规则指Windows Server 2008 R2系统访问外部的某台计算机通信数据流. 配置防火墙阻止Windows Server 2008 R2系统通过IE软件访问外部的网站服务器,阻止Wind ...

  10. jQuery event,冒泡,默认事件用法

    jQuery event,冒泡,默认事件用法 <%@ page language="java" import="java.util.*" pageEnco ...