读《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继承TwoDShapeTwoDShape继承Shapenew 出来一个Triangle的实例,调用Triangle上的toString方法,发现没有,就看父级是不是有,直到找不到为止。
【读《JavaScript面向对象编程指南》笔记|读《JavaScript面向对象编程指南》笔记 上】extend函数中设置Child.uber = Parent.prototype,uber属性设置成了指向其父级原型的引用,和es6类中constructor中super一样调用父级的方法。this.constructor.uber指向当前对象父级原型的引用。
因而,当调用Triangle实体的toString方法时,其原型链上所有的toString都会被调用。

    推荐阅读