<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>构造函数模式拓展</title>
</head>
<body>
<script type="text/javascript">
// 例1
function Fn1() {
// this -> f1
this.x = 100;
this.getX = function () {
console.log(this.x);
}
}
Fn();
// var f1 = new Fn();
var f1 = new Fn1;
f1.getX(); // 方法中的this是f1 -> 100
var ss = f1.getX();
ss(); // 方法中的this是Window -> undefined
// 1.在构造函数模式当中,new Fn()执行,如果Fn中不需要传递参数的话,后边的小括号() 可以省略
// 2.this的问题 : 在类中出现的this.xxx = xxx 中的this都是当前类的实例,而某一个属性值(方法),方法中的this需要看方法执行的时候前边时候有"." 才能知道this是谁
// 例2
function Fn2() {
var num = 10;
this.x = 100;
this.getX = function () {
console.log(this.x);
}
}
Fn();
var f2 = new Fn2;
console.log(f2.num); // undefined
// 类有普通函数的一面 当函数执行的时候 var num 其实只是当前形成的私有作用域中的私有变量而已 他和我们的f1这个实例没有任何关系; 只有this.xxx = xxx 才相当于给f1这个实例增加私有的属性和方法,才和我们的f1有关系...
// 例3
function Fn3() {
this.x = 100;
this.getX = function () {
console.log(this.x);
}
return {name:"珠峰"};
}
Fn();
var f3 = new Fn3;
console.log(f3);
// 在构造函数中 浏览器会默认的把我们的实例返回 (返回的是一个对象数据类型的值);如果我们自己手动写了return返回
// 返回的是一个基本数据类型的值,当前的实例是不变的 ,例如 return 100; 我们的f1还是当前Fn类的实例
// 返回的是一个引用数据类型的值,当前的实例会被自己返回的值替换掉
// 例4
function Fn4() {
this.x = 100;
this.getX = function () {
console.log(this.x);
}
}
Fn();
var f4 = new Fn4;
console.log(f4);
// 检测摸一个实例是否属于这个类 -> instanceof
console.log(f1 instanceof Fn); // true
console.log(f1 instanceof Array); // false
console.log(f1 instanceof Object) // true 因为所有的实例都是对象数据类型的 而每一个对象数据类型都是Object这个内置类的一个实例,所以f1也是他的一个实例
// 对于检测数据类型来说 typeof有自己的局限性,不能细分object下的对象 数组 正则
var a = [];
console.log(a instanceof Array); // true
// 例5
function Fn5() {
this.x = 100;
this.getX = function () {
console.log(this.x);
}
}
var f5 = new Fn5;
var f6 = new Fn5;
// f5 和 f6 都是Fn这个类的一个实例,都拥有x和getx两个属性.但是这两个属性都是各自的私有的属性,所以
console.log(f5.getX === f6.getX); //false
// in 检测某一个属性是否属于这个对象 (attr in object) ,不管是私有的属性还是共有的属性,只要存在,用in来检测都是true
console.log("getX" in f5); // true 是他的一个属性
// hasOwnProperty 用来检测某一个属性是否为这个对象的私有属性,这个方法只能检测私有的属性
console.log(f5.hasOwnProperty("getX")); // -> true
// 思考:检测某一个属性是否为该对象的"共有属性" hasPubProperty
function hasPubProperty(obj,attr) {
// 首先保证是他的一个属性 并且还不是私有的属性,那么只能是共有的属性
return (attr in obj) && !(obj.hasOwnProperty(attr));
}
console.log(hasPubProperty(f1,"getX")); // false
// 例6
// isprototypeOf 需要自己查
</script>
</body>
</html>
14-构造函数模式（拓展）
最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
- 文/潘晓璐 我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
- 文/花漫 我一把揭开白布。 她就那样静静地躺着，像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上，一...
- 文/苍兰香墨 我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
推荐阅读更多精彩内容
- 1. 构造函数模式 构造函数模式的函数体在每次new对象的时候都会执行一遍. new的话, 会自身创建一个作用域,...
- 首先今天先介绍一个新的模式，寄生（parasitic）构造函数模式，其基本思想是创建一个函数，该函数的作用仅仅是封...
