读《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=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继承TwoDShapeTwoDShape继承Shapenew 出来一个Triangle的实例,调用Triangle上的toString方法,发现没有,就看父级是不是有,直到找不到为止。

extend函数中设置Child.uber = Parent.prototype,uber属性设置成了指向其父级原型的引用,和es6类中constructor中super一样调用父级的方法。this.constructor.uber指向当前对象父级原型的引用。
因而,当调用Triangle实体的toString方法时,其原型链上所有的toString都会被调用。

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 203,937评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,503评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,712评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,668评论 1 276
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,677评论 5 366
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,601评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,975评论 3 396
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,637评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,881评论 1 298
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,621评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,710评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,387评论 4 319
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,971评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,947评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,189评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 44,805评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,449评论 2 342

推荐阅读更多精彩内容