20170322js面向对象
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>创建对象</title>
</head>
<body> <script type="text/javascript">
//创建一个学生对象
var student=new Object();
/*对象的属性*/
student.name="小黑";
student.age=18;
student.address="黄土高坡";
/*对象的行为 函数*/
student.showInfo= function() {
document.write("姓名："+this.name+"<br/>");
document.write("年龄："+student.age+"<br/>");
document.write("地址："+this.name+"<br/>");
}
/*调用方法*/
student.showInfo();
</script>
</body>
</html>
创建对象
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>通过字面量赋值的方式创建对象</title>
</head>
<body> <script type="text/javascript">
/*创建一个学生对象
* {中的内容是json数据格式}
* 特点就是 ---》
* 属性名1：属性值1,
* 属性名2：属性值2,
* 属性名3：属性值3
*
* student就是一个变量，也是一个对象
* */
var student={
/*对象的属性*/
name:"小黑",
age:50,
address:"地狱",
/*对象的行为 函数*/
showInfo: function () {
document.write("姓名："+this.name+"<br/>");
document.write("年龄："+this.age+"<br/>");
document.write("地址："+this.address+"<br/>");
},
showName:function(){
document.write("姓名："+this.name+"<br/>");
} } /*调用方法*/
student.showName();
student.showInfo(); </script> </body>
</html>
通过字面量赋值的方式创建对象
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>通过构造函数创建多个对象</title>
</head>
<body>
<script type="text/javascript">
/*Student必须首字母大写 所有对象公用的构造方法*/
function Student(name,age,address){
/*给属性赋值*/
this.name=name;
this.age=age;
this.address=address;
/*设置方法*/
this.showInfo=function(){
document.write("姓名："+this.name+"<br/>")
document.write("年龄："+this.age+"<br/>")
document.write("地址："+this.address+"<br/>")
};
this.showName=function(){
document.write("姓名："+this.name+"<br/>") }
}
//真正的对象
var stu1=new Student("小黑",50,"上海1");
var stu2=new Student("小白",60,"上海2");
var stu3=new Student("小红",70,"上海3"); /*调用对象的方法*/
stu1.showName();
stu2.showName();
stu3.showInfo(); /*所有的对象都有一个constructor属性 指向了构造方法*/
alert(stu1.constructor==Student);
/*instanceof 判断对象是否属于某个类型*/
alert(stu1 instanceof Student);
alert(stu1 instanceof Object); </script>
</body>
</html>
通过构造函数创建多个对象
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>原型对象</title>
</head>
<body> <script type="text/javascript">
/*创建一个构造函数*/
function Student(){}
/*每个函数中都有一个prototype(原型对象)
* 这个属性就是一个指针，指向了一个对象！
*
* prototype就是通过构造函数来创建这个对象实例的原型对象！
* */
Student.prototype.name="小黑";
Student.prototype.age=50;
Student.prototype.address="天堂";
/*书写方法*/
Student.prototype.showInfo=function(){
document.write("姓名："+this.name+"<br/>");
document.write("年龄："+this.age+"<br/>");
document.write("地址："+this.address+"<br/>");
};
Student.prototype.showName=function(){
document.write("姓名："+this.name+"<br/>");
}
/*创建对象*/
var stu1=new Student();
stu1.name="哈哈";
stu1.showInfo(); </script> </body>
</html>
原型对象
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>原型链</title>
<!-- 原型链： 一个原型对象 是另一个原型对象的实例！
相关的原型对象层层递进，就构成了 实例与原型对象的链条！-->
</head>
<body>
<script type="text/javascript">
/*创建了一个动物构造函数*/
function Animal(){
this.aName="动物类";
}
/*写了一个获取名称的方法*/
Animal.prototype.getName=function(){
return this.aName;
}
/*创建一个小狗狗构造函数*/
function Dog(){
this.dName="小狗";
}
/*Dog原型对象是Animal原型对象的实例*/
Dog.prototype=new Animal();
Dog.prototype.getDogName=function(){
return this.dName;
}
/*创建小狗对象*/
var dog=new Dog();
document.write((dog.getDogName())+"<br/>"); //自身的方法
document.write((dog.getName())+"<br/>"); //父类的方法
document.write((dog instanceof Object)+"<br/>");
document.write((dog instanceof Dog)+"<br/>");
document.write((dog instanceof Animal)+"<br/>"); </script> </body>
</html>
原型链01
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>原型链</title>
<!-- 原型链： 一个原型对象 是另一个原型对象的实例！
相关的原型对象层层递进，就构成了 实例与原型对象的链条！-->
</head>
<body>
<script type="text/javascript">
/*创建了一个动物构造函数*/
function Animal(){
this.name="动物类";
}
/*写了一个获取名称的方法*/
Animal.prototype.getName=function(){
return this.name;
}
Animal.prototype.sayHello=function(){
return "动物好";
}
/*创建一个小狗狗构造函数*/
function Dog(){
this.name="小狗";
}
/*Dog原型对象是Animal原型对象的实例*/
Dog.prototype=new Animal();
Dog.prototype.getName=function(){
return this.name;
} /*重写父类的方法*/
Dog.prototype.sayHello=function(){
return "小狗好";
} /*创建小狗对象*/
var dog=new Dog();
document.write((dog.getName())+"<br/>"); //自身的方法
document.write((dog.sayHello())+"<br/>"); //父类的方法 var animal=new Animal();
document.write((animal.getName())+"<br/>"); //自身的方法 动物 </script> </body>
</html>
原型链02
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>继承</title>
</head>
<body> <script type="text/javascript">
function Person(){
this.names=["小黑","小红","小豆腐"];
}
function Student(){ }
//让学生继承 Person
Student.prototype=new Person();
//创建一个学生对象
var stu1=new Student();
stu1.names.push("小白");
document.write(stu1.names+"<br/>"); //再创建一个对象
var stu2=new Student();
document.write(stu2.names); </script>
</body>
</html>
继承
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>借用构造函数</title>
</head>
<body>
<script type="text/javascript">
function Person(){
this.names=["小黑","小红","小豆腐"];
} function Student(){
Person.call(this); //继承了 Person
}
//创建一个学生对象
var stu1=new Student();
stu1.names.push("小白");
document.write(stu1.names+"<br/>");
//再创建一个对象
var stu2=new Student();
document.write(stu2.names); //没有小白！ </script> </body>
</html>
借用构造函数
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>借用构造函数 传递参数</title>
</head>
<body> <script type="text/javascript">
function Person(name){
this.name=name;
}
function Student(){
Person.call(this,"小黑"); //继承了 Person的同时 传递了参数
this.age=50;
}
//创建学生对象
var stu=new Student();
document.write(stu.name+"<br/>");
document.write(stu.age); </script> </body>
</html>
借用构造函数 传递参数
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>组合继承</title>
</head>
<body> <script type="text/javascript">
/*构造方法*/
function Person(name){
this.name=name;
this.names=["hei","bai","pei"];
}
Person.prototype.sayHello=function(){
alert(this.name);
} function Student(name,age){
Person.call(this,name);//继承属性
this.age=age;
} Student.prototype=new Person(); //继承了方法
//student特有的方法
Student.prototype.sayBye=function(){
alert(this.names);
}
/*创建对象*/
var stu=new Student("小嘿嘿",50);
stu.names.push("小白白");
document.write(stu.names+"<br/>")
stu.sayHello();
stu.sayBye(); var stu1=new Student("小嘿嘿2",50);
document.write(stu1.names+"<br/>");
stu1.sayHello();
stu1.sayBye(); </script> </body>
</html>
组合继承
20170322js面向对象的更多相关文章
- angular2系列教程（六）两种pipe：函数式编程与面向对象编程
今天,我们要讲的是angualr2的pipe这个知识点. 例子
- 一起学 Java（二）面向对象
一.方法函数 函数也称为方法,就是定义在类中的具有特定功能的一段独立代码.用于定义功能,提高代码的复用性. 函数的特点1> 定义函数可以将功能代码进行封装,便于对该功能进行复用:2> 函数 ...
- js面向对象学习 - 对象概念及创建对象
原文地址:js面向对象学习笔记 一.对象概念 对象是什么?对象是“无序属性的集合,其属性可以包括基本值,对象或者函数”.也就是一组名值对的无序集合. 对象的特性(不可直接访问),也就是属性包含两种,数 ...
- 前端开发：面向对象与javascript中的面向对象实现（二）构造函数与原型
前端开发:面向对象与javascript中的面向对象实现(二)构造函数与原型 前言(题外话): 有人说拖延症是一个绝症,哎呀治不好了.先不说这是一个每个人都多多少少会有的,也不管它究竟对生活有多么大的 ...
- .NET 基础 一步步 一幕幕[面向对象之对象和类]
对象和类 本篇正式进入面向对象的知识点简述: 何为对象,佛曰:一花一世界,一木一浮生,一草一天堂,一叶一如来,一砂一极乐,一方一净土,一笑一尘缘,一念一清静.可见"万物皆对象". ...
- 简单分析JavaScript中的面向对象
初学JavaScript的时候有人会认为JavaScript不是一门面向对象的语言,因为JS是没有类的概念的,但是这并不代表JavaScript没有对象的存在,而且JavaScript也提供了其它的方 ...
- Java程序员应该了解的10个面向对象设计原则
面向对象设计原则: 是OOPS(Object-Oriented Programming System,面向对象的程序设计系统)编程的核心,但大多数Java程序员追逐像Singleton.Decorat ...
- JavaScript学习笔记(三)——this、原型、javascript面向对象
一.this 在JavaScript中this表示:谁调用它,this就是谁. JavaScript是由对象组成的,一切皆为对象,万物皆为对象.this是一个动态的对象,根据调用的对象不同而发生变化, ...
- 带你一分钟理解闭包--js面向对象编程
上一篇<简单粗暴地理解js原型链--js面向对象编程>没想到能攒到这么多赞,实属意外.分享是个好事情,尤其是分享自己的学习感悟.所以网上关于原型链.闭包.作用域等文章多如牛毛,很多文章写得 ...
随机推荐
- 移动web——bootstrap模板
基本概念 1.bootstrap就是在媒体查询技术出现以后才开始出现的 2.此技术使响应式开发变得十分轻松,最大特点就是栅格系统(什么设备上如何显示)以及响应式工具(是否可见) 基本模板 <!D ...
- [Windows Server 2012] 杰奇CMS安全设置
★ 欢迎来到[护卫神·V课堂],网站地址:http://v.huweishen.com ★ 护卫神·V课堂 是护卫神旗下专业提供服务器教学视频的网站,每周更新视频. ★ 本节我们将带领大家:JIEQI ...
- RTL Compiler之Technology Library
1 Target Library Design Compiler uses the target library to build a circuit. During mapping, Design ...
- Eclipse + Pydev开发Python时import报错解决方法
一. 原文链接:http://blog.csdn.net/lhanchao/article/details/51306626 用eclipse +PyDev开发python时, ...
- CSS3利用box-shadow实现相框效果
CSS3利用box-shadow实现相框效果 <style> html { overflow: hidden; background-color: #653845; background- ...
- Go 时间相关
>获取当前时间: t := time.Now() >获取当天开始.结束时间: tm1 := time.Date(t.Year(), t.Month(), t.Day(), 0, 0, 0, ...
- haproxy故障处理
1. haproxy 在配置健康检查的时候,默认没有配置页面检查 ,通过端口状态来检测.后端IIS web服务开始可能 是一个站点,或者采用了基于域名的配置方式,导致目前站点停了,后端主机不能被hap ...
- CPU 指令集（Instruction Set Architecture, ISA）
本文摘自网络 概念 指令集是存储在CPU内部,对CPU运算进行指导和优化的硬程序,用来引导CPU进行加减运算和控制计算机操作系统的一系列指令集合.拥有这些指令集,CPU就可以更高效地运行.系统所下达的 ...
- 怎么选择最适合自己的Python培训机构？
Python培训已经成为入门Python的一个重要途径,它的优势在于学习知识的系统性.快速性和实用性.Python培训毕业的学员大多数拥有较强的实战动手能力,能够较快上手,更符合企业需求. 不过,大部 ...
- 28 I/O限制的异步操作
28.2 C#的异步函数 private static async Task<string> IssueClientRequestAsync(string serverName, stri ...