ホームページ >ウェブフロントエンド >jsチュートリアル >JavaScript 高度なプログラミング (第 3 版) 学習ノート 第 6 章と第 7 章_JavaScript スキル
第 6 章、オブジェクト指向プログラミング
オブジェクト:
1. データ属性
構成可能。削除によって属性を削除して属性を再定義できるかどうか、属性の特性を変更できるかどうか、または属性をアクセサー属性に変更できるかどうかを示します。デフォルトは true
。
enumerbale、for-in を通じて属性にアクセスできるかどうかを示します。デフォルトは true
書き込み可能、属性値を変更できるかどうかを示し、デフォルトは true
値、データ保存場所、デフォルトは未定義
デフォルトの属性特性を変更します: Object.defineProperty()。属性が配置されているオブジェクト、属性名、記述子オブジェクトの 3 つのパラメーターを受け取ります。記述子オブジェクトの属性は、構成可能、列挙可能、書き込み可能、値
例:
var obj = {}; Object.defineProperty(obj,”name”,{ writable:true, value:”nihao” });
2. アクセサーのプロパティ
構成可能。削除によって属性を削除して属性を再定義できるかどうか、属性の特性を変更できるかどうか、または属性をアクセサー属性に変更できるかどうかを示します。デフォルトは true
。
列挙。for-in を通じて属性にアクセスできるかどうかを示します。デフォルトは true
get、属性の読み取り時に呼び出され、デフォルトは未定義です
セット、属性の書き込み時に呼び出され、デフォルトは未定義です
変更は Object.defineProperty() を通じて行う必要があります
例:
var obj = { _year:2004, edition:1 } Object.defineProperty(book,”year”,{ get:function(){ return this._year; }, set:function(newValue){ if(newValue > 2004){ this._year = newValue; this.edition += newValue – 2004; } } }); book.year = 2005; alert(book.edition); //2
複数のプロパティを定義します: Object.defineProperties() は 2 つのオブジェクトを受け取ります。1 つは変更または追加されるプロパティです。2 番目のオブジェクトのプロパティは、変更される最初のオブジェクトのプロパティと 1 対 1 に対応します。または追加されたブラウザ: IE9+、FireFox4+、Safari5+、Opera12+、chrome
属性の読み取り: Object.getOwnPropertyDescriptor() は、属性が配置されているオブジェクトと、読み取る記述子の属性名という 2 つのパラメーターを受け取ります。 サポートされているブラウザー: IE9+、FireFox4+、Safari5+、Opera12+、chrome
。
オブジェクトの作成:
工場出荷時モード:
function createPerson(name,age){ var o = new Object(); o.name = name; o.age = age; o.sayName = function(){ alert(this.name); }; return o; } var person1 = createPerson(“g”,29);
コンストラクター パターン:
function Person(name,age){ this.name = name; this.age = age; this.sayName() = function(){ alert(this.name); }; } var person = new Person(“g”,28);
2 つのモードの違い:
作成したオブジェクトをコンストラクターモードで表示したり、直接値を代入したりする必要がなく、return文もありません
コンストラクター名の最初の文字は大文字にする必要があり、新しいインスタンスを作成するには new 演算子を使用する必要があります
プロトタイプモード
作成された各関数には、オブジェクトへのポインターであるプロトタイプ属性があります。このオブジェクトの目的は、特定の型のすべてのインスタンスで共有できるプロパティとメソッドを含めることです。関数によって作成されたオブジェクトのプロトタイプ オブジェクト。利点は、すべてのインスタンスが同じプロパティとメソッドを共有できることです。
isPrototypeOf()、私の個人的な理解は、インスタンスのプロトタイプが現在のプロトタイプと同じかどうかを判断するために使用できるということです
例:
person.prototype.isPrototypeOf(person1); //true
Object.getPrototypeOf() は、特定のインスタンスのプロトタイプを返すことができます。サポートされているブラウザーは IE9 以降、Firefox3.5 以降、Safari5 以降、Opera12 以降、chrome
注: オブジェクト属性名にアクセスすると、まずインスタンス オブジェクト内で検索が実行されます。存在しない場合は、現在のオブジェクトのプロトタイプ オブジェクト内で検索されます。
注: インスタンスの属性がプロトタイプ オブジェクトの属性と同じである場合、プロトタイプ オブジェクトの属性はブロックされます。これは前のオブジェクトとまったく同じです
hasOwnProperty() メソッドは、プロパティがインスタンスからのものであるかどうかを判断できます。インスタンスからのものでない場合は false を返し、それ以外の場合は true を返します。
インスタンスで delete を呼び出すと、インスタンスの属性名のみが削除され、プロトタイプの属性は削除されません
例:
function Person(){ } Person.prototype.name = "Nicholas"; Person.prototype.age = 29; Person.prototype.sayName = function(){ alert(this.name); } var per1 = new Person(); var per2 = new Person(); per1.name = "Greg"; alert(per1.name); //"Greg" 来自实例 alert(per2.name); //"Nicholas" delete per1.name; alert(per1.name); //"Nicholas" 来自原型 delete per1.name; alert(per1.name); //"Nicholas"
注: Object.getOwnPropertyDescriptor() メソッドは、インスタンス プロパティにのみ使用できます。プロトタイプ プロパティ記述子を取得するには、このメソッドをプロトタイプ オブジェクトで直接呼び出す必要があります。
in 演算子: 属性がインスタンス オブジェクトまたはプロトタイプ オブジェクトにある場合にのみ true を返します
例:
alert(“name” in Person); //true alert(“name” in per1); //true
in と hasOwnProperty を同時に使用して、プロパティがプロトタイプまたはインスタンスに存在するかどうかを判断します
Object.keys() メソッド: オブジェクトをパラメータとして受け取り、列挙可能なすべてのプロパティで構成される文字列配列を返します
Object.getOwnPropertyNames() メソッド: オブジェクトを受け取り、列挙可能かどうかに関係なく、すべてのプロパティで構成される文字列配列を返します
より単純なプロトタイプ構文:
上記の方法は面倒なので、オブジェクトリテラルを使用する方法が一般的です。
Person.prototype = { name : “Nicholas”, age : 29 sayName = function(){ alert(this.name); } }
ただし、このメソッドはプロトタイプ オブジェクト全体を書き直すことと同等であり、その結果、コンストラクター プロパティは person ではなく Object を指すようになりますが、instanceof は引き続き正しい結果を返しますが、コンストラクターを通じてオブジェクトの型を決定することはできません。 。
var per = new Person(); alert(per instanceof Object); //true alert(per instanceof Person); //true alert(per constructor Object); //true alert(per constructor Person); //false
若constructor真的很重要,可以如下设置
Person.prototype = { constructor:Person, name : “Nicholas”, age : 29 sayName = function(){ alert(this.name); } }
以上写法会使constructor的enumerable特性被设置为true,默认情况下原生的是false的,在兼容ECMAScript5的浏览器可以使用Object.defineProperty()进行设置
Object.defineProperty(Person.prototype,”constructor”,{ enumerable:false, value:Person });
注:重写原型对象,将会切断现有原型与任何之前已经存在的对象实例之间的联系
继承(难度较大,需再仔细研究)
使用原型链来实现
子类型要覆盖超类的方法,应该将给原型添加方法的代码放在替换原型之后,
注:通过原型链实现继承时,不能使用对象字面量创建原型方法,否则会重写原型链
借用构造函数
组合继承
原型式继承,Object.creat();接收两个参数:一是用作新对象原型的对象和(可选的)一个为新对象定义额外属性的对象
例:Object.creat(person,{name:{value:”greg”}});
寄生式继承
寄生组合式继承
第7章,函数表达式
创建方式:
1、函数声明,可以函数声明提升,就是可以把使用函数的语句放在函数声明之前
function funName(arg0,arg1){ //函数体 }
2、函数表达式,不能进行函数提升,也就是无法在函数创建前使用函数,在这种情况下创建的函数称为匿名函数,有时也叫拉姆达函数
var funName = function(arg0,arg1){ //函数体 }
严格模式下无法使用arguments.callee来实现递归,可以使用如下方式实现递归:
var factorial = (function f(num){ if(num <= 1){ return 1; }else{ return num * f(num - 1); } });
闭包(难度也不小)
闭包指有权访问另一个函数作用域中的变量的函数,闭包,也是一个函数
创建闭包的常见方式是在一个函数内部创建另一个函数
闭包只能取得包含函数即外部函数中任何变量的最后一个值。下例可以清晰说明问题
例:
function createFuncrions(){ var result = new Array(); for(var i = 0;i < 10;i++){ result[i] = function(){ return i; } } return result; } var re = createFuncrions(); alert(re[1](2));
每个函数返回的都将是10,而不是如预期般返回对应的索引值,因为createFuncrions函数最后返回时I = 10,此时每个函数都引用保存着变量i的同一个对象,所以在每个函数内部i都是10,可以使用如下方法强制闭包返回预期效果:
function createFuncrions(){ var result = new Array(); for(var i = 0;i < 10;i++){ result[i] = function(num){ return function(){ return num; }; }(i); } return result; } var re = createFuncrions(); alert(re[2]());
每一个都会返回各自的索引值
模仿块级作用域
使用匿名函数可以模仿块级作用域:
(function(){ alert("test"); //块级作用域,没有使用圆括号将function包起来将会出错 })();
使用闭包和私有变量的明显不足之处在于,会在作用域链中多查找一个层次,在一定程度上影响查找速度
函数中定义的变量可以在一定程度上称为私有变量,通过函数可以模拟出私有变量,静态私有变量
增强模块模式:
var singleton = function(){ //private arg and private method var privateVariable = 10; function privateFunction(){ return false; } //create obj var obj = new Object(); obj.publicProperty = true; obj.publicFunction = function(){ privateVariable ++; return privateFunction(); }; return obj; }(); alert(typeof singleton); alert(singleton.publicProperty); alert(singleton.publicFunction());
以上内容是小编给大家介绍的JavaScript高级程序设计(第三版)学习笔记6、7章,希望对大家有所帮助!