1.封装(encapsulation)函数(function)
函数对任何语言来说都是一个核心的概念。通过函数可以 封装任意多条语句,而且可以在任何地方、任何时候调用执行。
封装方法: 将语句写进函数的括号内,成为函数体,然后就可以调用了。
缺点:
- 容易被同名变量覆盖--因为在全局作用域下声明的变量,容易被同名变量覆盖
- 会立即执行--解析器读取到此处立即执行
优点:
- 避免了全局变量--因为存在函数作用域
- 按需执行--解析器读取到此处,函数并未执行,只有当你需要的时候,调用此函数即可
- 提高代码重用性
注意:
- 函数存在局部作用域
- 函数存在函数提升--因此,函数可以在声明之前调用
- 函数内可以访问作用域链
2.代码演示
未封装代码:
var body = document.getElementsByTagName("body")[0];
var h1 = document.createElement("h1");
body.style.backgroundColor = "blue;
h1.innerText = "1";
body.appendChild(h1);
封装代码:
//实现类,内部通过this指向当前对象,通过this添加属性或者方法
var Book = function (id, name, price) {
//私有属性
var name = '',
price = 0;
//私有方法
function checkId() {
}
//对象共有属性
this.id = id;
//可操作私有属性的方法
this.getName = function () {};
this.setName = function () {};
this.getPrice = function () {};
this.setPrice = function () {};
//对象共有方法
this.copy = function () {
// ...
}
//安全模式
// console.log(this)//Book or Window
if(this instanceof Book){
this.setName(name);
this.setPrice(price);
}else{
return new Book(id, name, price)
}
}
//类静态共有属性和方法(实例对象不能访问)
Book.isChinses = true;
Book.resetTime = function () {
console.log('new time')
}
//共有属性和方法
Book.prototype = {
isJSBook: false,
display: function () {
console.log('display')
}
}