读《JavaScript面向对象编程指南》笔记|读《JavaScript面向对象编程指南》笔记 上
第二章,基本数据类型、数组、循环及条件表达式Infinity是一个特殊值,它代表的是超出JavaScript处理范围的数值,但依然还是一个数字
>>> Infinity
Infinity
>>> typeof Infinity
'number'
>>> 1e309
Infinity
>>> 1e308
1e+308
>>> 6/0
Infinity
>>> 6%0
NaN
>>> typeof NaN
number
>>> !!"false"
true//还以为是false
>>> !!undefined
false
第三章,函数作用域链 js不存在大括号级的作用域,但它有函数级作用域,也就是说,在函数内定义的变量在函数外是不可见的。if和for中,代码块是可见的。
词法作用域 js中,每个函数都有一个自己的词法作用域。也就是说,每个函数在被定义时(而非执行时)都会创建一个自己的作用域
闭包突破作用域链 闭包拿到本来不属于自己的东西
function f(){
var b="b";
return function(){
return b;
}
}
这个函数含有一个局部变量b,它在全局空间里是不可见的,通过闭包,把f函数内的b暴露到函数作用域外了
Getter与Setter
var getValue,setValue;
(function(){
var secret=0;
getValue=https://www.it610.com/article/function(){
return secret;
};
setValue=function(){
secret=v;
}
})();>>>getValue()
0
>>>setValue(123)
123
编写一个将十六进制转换为颜色的函数,以蓝色为例,#0000FF应被表示成“rgb(0,0,255)”的形式。然后将函数命名为getRGB(),并用以下代码进行测试。
var a=getRGB("#00FF00")
得到a为rgb(0,255,0)
var getRGB=function(x){
var ox1=x.slice(1,3);
var ox2=x.slice(3,5);
var ox3=x.slice(5,7);
return 'rgb('+parseInt(ox1,16)+','+parseInt(ox2,16)+','+parseInt(ox3,16)+')';
}
var b=getRGB('#00ff00');
第四章,对象在Math对象不存在的情况下,创建一个类似的MyMath对象,并为其添加以下方法:
MyMath.rand(min,max,inclusive)--随即返回min到max区间中的一个数,并且在inclusive为true时为闭区间(这也是默认情况)
这个时候需要一个随机会变化的数才能做到和
Math.rand()
一样生成一个随机数,时间戳就是会变化的数var MyMath = {};
MyMath.rand = function(min, max, inclusive) {
if (inclusive) {
return (Date.now()) % (max - min + 1) + min;
}
return (Date.now()) % (max - min - 1) + min + 1;
}
MyMath.rand(10,100,true);
给String原型链上添加reverse反序的方法
String.prototype.reverse=function(){
return Array.prototype.reverse.apply(this.split('')).join('');
}
console.log("sllsfa".reverse());
第五章,原型
- 每个函数中都有一个prototype属性,该属性所存储的就是原型对象
- 对象中存在一个指向相关原型的链接
__proto__
(私有属性),__proto__
和prototype
不是等价的。__proto__
是某个实体对象的属性,而prototype
则是属于构造期函数的属性
var monkey={
feeds:'bananas',
breathes:'air'
}
function Human(){}
Human.prototype=monkey;
var developer=new Human();
Human.prototype.go=1;
developer.feeds='pizza';
developer.hacks='JavaScript';
>>>typeof developer.__proto__
'object'
>>>typeof developer.prototype
'undefined'
- constructor 属性是专门为 function 而设计的,它存在于每一个 function 的prototype 属性中。这个 constructor 保存了指向 function 的一个引用
function foo(a,b){
return a*b;
}
var l=new foo();
>>>l.construtor
>>>? foo(a,b){
return a*b;
}
-
for in
循环会遍历对象上原型链上的方法,但不是所有属性都会被遍历,如数组的length属性和constructor,可枚举的属性才会遍历,通过对象的propertyIsEnumerable()方法判断其中哪些可枚举。
function Gadget(name,color){
this.name=name;
this.color=color;
this.someMethod=function(){
return 1;
}
}
Gadget.prototype.price=10;
Gadget.prototype.rating=3;
var newtoy=new Gadget('webcam','black');
for(var prop in newtoy){
console.log(prop+' = '+newtoy[prop]);
}
>>>name = webcam
color = black
someMethod = function (){
return 1;
}
price = 10
rating = 3
>>>newtoy.hasOwnProperty('name')
true
>>>newtoy.hasOwnProperty('price')
false
>>>newtoy.propertyIsEnumerable('name')
true
>>>newtoy.propertyIsEnumerable('price')
false
第六章,继承
// inheritance helper
function extend(Child, Parent) {
var F = function() {};
F.prototype = Parent.prototype;
Child.prototype = new F();
Child.prototype.constructor = Child;
Child.uber = Parent.prototype;
}
// define -> augment
function Shape() {}
Shape.prototype.name = 'Shape';
Shape.prototype.toString = function() {
return this.constructor.uber ?
this.constructor.uber.toString() + ', ' + this.name :
this.name;
};
// define -> inherit -> augment
function TwoDShape() {}
extend(TwoDShape, Shape);
TwoDShape.prototype.name = '2D shape';
// define
function Triangle(side, height) {
this.side = side;
this.height = height;
}
// inherit
extend(Triangle, TwoDShape);
// augment
Triangle.prototype.name = 'Triangle';
Triangle.prototype.getArea = function() {
return this.side * this.height / 2;
};
var triangle=new Triangle(5,10);
triangle.toString();
Triangle
继承TwoDShape
,TwoDShape
继承Shape
,new
出来一个Triangle
的实例,调用Triangle
上的toString
方法,发现没有,就看父级是不是有,直到找不到为止。【读《JavaScript面向对象编程指南》笔记|读《JavaScript面向对象编程指南》笔记 上】在
extend
函数中设置Child.uber = Parent.prototype
,uber属性设置成了指向其父级原型的引用,和es6类中constructor中super
一样调用父级的方法。this.constructor.uber
指向当前对象父级原型的引用。因而,当调用Triangle实体的toString方法时,其原型链上所有的toString都会被调用。
推荐阅读
- 慢慢的美丽
- 《真与假的困惑》???|《真与假的困惑》??? ——致良知是一种伟大的力量
- 《跨界歌手》:亲情永远比爱情更有泪点
- 考研英语阅读终极解决方案——阅读理解如何巧拿高分
- Ⅴ爱阅读,亲子互动——打卡第178天
- 诗歌:|诗歌: 《让我们举起世界杯,干了!》
- 期刊|期刊 | 国内核心期刊之(北大核心)
- 《魔法科高中的劣等生》第26卷(Invasion篇)发售
- “成长”读书社群招募
- 上班后阅读开始变成一件奢侈的事