如何封装类中的私有成员
# 1.如何封装类中的私有成员
**知识点**
1. 构造函数与类
2. 类成员的访问
3. 类中私有成员的方法
----------------------------------------
## 1. 构造函数与类
- JavaScript本无类,它的类是通过*构造函数*模拟的
- *构造函数*与普通函数本无区别,仅仅是必须关键字`new`调用
----------------------------------------
## 2. 类成员的访问
- 类内部使用实例引用: `let F = function(){this.pro = value}`
- 类外部使用类实例访问: `let o = new F(); o.pro`
----------------------------------------
## 3. 类中私有成员的访问
- 声明: `let _pro = value`
- 访问: 自定义获取与设置方法完成
----------------------------------------
### 示例: code/demo01.html
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>如何封装类中的私有成员</title>
</head>
<body>
<script>
// js中的类,是通过构造函数模拟
let Stu1 = function (name, course, grade) {
this.name = name;
this.course = course;
this.grade = grade;
};
let stu1 = new Stu1('peter', 'javascript', 88);
console.log( stu1.name + '的' + stu1.course + '成绩是:' + stu1.grade );
console.log ('\n');
// 运行结果: peter的javascript成绩是:88
// 成绩是学生的隐私, 不能随意让人查看,仅限管理员: admin查看
// 应该如何操作呢?
// 将成绩字段设置为私有成员, 仅限用户名为admin查看
// 利用函数作用域对全局不可见的的特征实现
let Stu2 = function (name, course, grade) {
this.name = name;
this.course = course;
let _grade = grade;
};
let stu2 = new Stu2('peter', 'javascript', 88);
console.log( stu2.name + '的' + stu2.course + '成绩是:' + stu2._grade );
console.log ('\n');
// peter的javascript成绩是:undefined
// 为什么this.grade是undefined呢? 因为grade是属于构造函数的,不属于它的实例,当然也不能通过this来引用
// 于是成功了实现类中的成员隐藏,即类中的私有成中的封装
// 那么,如何才能访问到类中的私有成员呢? 这里的访问有二层意思: 即读取与设置
// 所以需要在类中,为这个私有成员,量身定制二个方法: 获取器和设置器
let Stu3 = function (name, course, grade) {
this.name = name;
this.course = course;
let _grade = grade;
// 闭包: 只要变量与函数位于同一个词法作用域内,那么函数就可以访问这些变量,即使作用域消失仍可以访问
// 词法作用域,也叫静态作用域, 就是用户写代码时,就确定好的,不会因为程序执行而发生改变
// 闭包: 简单的理解,就是子函数可以父函数中的变量,即使在全局,父函数作用域消失的情况下,仍可以访问
// 闭包能实现的原因是: 同一个词法作用域中的成员是平级的,彼此是可见的,当然也是可以访问的,成员包括变量和函数
this.getGrade = function () {
return (this.name === 'admin') ? _grade : '无权查看';
};
this.setGrade = function (newGrade) {
return (this.name === 'admin') ? _grade = newGrade : '无权设置';
}
};
let stu3 = new Stu3('peter', 'javascript', 88);
console.log( stu3.name + '的' + stu3.course + '成绩是:' + stu3.getGrade() );
console.log( stu3.name + '的' + stu3.course + '成绩是:' + stu3.setGrade(95) );
console.log ('\n');
let stu4 = new Stu3('admin', 'javascript', 88);
console.log( stu4.name + '的' + stu4.course + '成绩是:' + stu4.getGrade() );
console.log( stu4.name + '的' + stu4.course + '成绩是:' + stu4.setGrade(95) );
</script>
</body>
</html>
```