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

javascript如何封装函数

2017-02-28 16:23 106 查看
通常写js组件开发的,都会用到匿名函数的写法去封装一个对象,与外界形成一个闭包的作用域。封装,全天下漫天遍野的封装,JQuery,EXT和Prototype.js封装的是javascript,jQuery uI和jQuery mobile封装着jQuery,java中的JDBC在spirng,Hibernate等框架封装着。

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<script type="text/javascript">
var beibei = {
init:function () {
console.log('come in here!');
}
};
beibei.init();

//构造函数
function Person() {
this.name = "beibei";
this.age = 26;
this.getName = function () {
return this.name;
}
}
var person = new Person();
console.log(person.age);
console.log(person.getName());

function Person(name,age) {
this.name = name;
this.age = age;
this.getName = function () {
return this.name;
}
}

var p1 = new Person("beibei",10);
console.log(p1.name);
console.log(p1.age);
console.log(p1.getName());

//这样写是没问题的 但是 有一点缺陷 就是 每个对象都维护相同的方法实例 而其实它们可以共享此方法 而不必每个对象都生成此实例
//在java语言中 面向对象的思想中 有一条“继承”既然此方法对于每个对象来说是公用的 那么可以在它的父类中实现
//在javascript中继承 是基于原型对象的继承 在原型对象中实现此方法,那么每个对象调用次方法时 首先查看自己是否有此方法 如果有 调用自己的方法
//如果没有 去原型对象中查询 调用原型对象的方法 是不是和java中的继承差不多呢? 这是修改后的代码。

function Person(name,age) {
this.name = name;
this.age = age;
}

Person.prototype.getName = function () {
return this.name;
}

var p1 = new Person("beibei",10);
console.log(p1.name);
console.log(p1.age);
console.log(p1.getName());

//对象字面量的形式构造对象
var p1 = {
name:"beibei",
age:10,
getName:function () {
return this.name;
}
}
console.log(p1.name);
console.log(p1.age);
console.log(p1.getName());

</script>
</body>
</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: