您的位置：首页 > Web前端 > JavaScript

JavaScript 面向对象基本概念

2017-11-30 20:52 369 查看

什么是对象

什么是收音机

对象是一个整体，对外提供一些操作

什么是面向对象

使用对象时，只关注对象提供的功能，不关注其内部细节

比如JQuery

面向对象是一种通用思想，并非只有编程中能用，任何事情都可以用

面向对象编程(OOP)的特点

抽象：抓住核心问题

封装：不考虑内部实现，只考虑功能使用

继承：从已有对象上，继承出新的对象

多重继承

多态

对象的组成

方法——函数：过程、动态的

属性——变量：状态、静态的

为对象添加方法和属性

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script>
var arr=[1,2,3,4,5];

var a=12;       //变量：自由
arr.a=5;        //属性：属于一个对象

function show() //函数
{
alert('a');
}

arr.fn=function ()  //方法
{
alert('a');
};
</script>
</head>

<body>
</body>
</html>

this详解，事件处理中this的本质

window

this——函数属于谁

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd
4000
">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script>
function show()
{
alert(this);
}

show(); //window
</script>
</head>

<body>
</body>
</html>

不能在系统对象中随意附加方法、属性，否则会覆盖已有方法、属性

object对象

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script>
var arr=[12, 65, 87];

//this：当前的方法，属于谁

arr.show=function ()
{
alert(this);
};

oDiv.onclick=function ()
{
alert(this);
};
</script>
</head>

<body>
</body>
</html>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script>
var obj=new Object();

obj.name='blue';
obj.sex='男';

obj.showName=function ()
{
alert('我的名字叫：'+this.name);
};
obj.showSex=function ()
{
alert('我是'+this.sex+'的');
};

var obj2=new Object();

obj2.name='leo';
obj2.sex='女';

obj2.showName=function ()
{
alert('我的名字叫：'+this.name);
};
obj2.showSex=function ()
{
alert('我是'+this.sex+'的');
};

obj.showName();
obj.showSex();
obj2.showName();
obj2.showSex();
</script>
</head>

<body>
</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航