2014年11月1日 星期六

20141101 今日學習

美好的一天要從哈哈大笑開始 ^口^


聽說他今天跟賴素如緊急切割 XD


看到一個很可愛的影片,寶寶很可愛很幸福,爸爸是個厲害溫柔的Maker,羅伯特魂啊!!!
偶然發現Sally分享的練深蹲教學文,很久沒蹲了

估狗找到jeromeetienne以前弄的MMO3d在此備份一下
  • D:/work/WebGL%20Learning/slides-master/howtomakeagame-nextgamefrontier-2014/demos/mike-map/index.html
根據昨天的紀錄,從JavaScript Objects in DetailOwn and Inherited Properties這節開始

Own and Inherited Properties這節就在講,一個object裡的property是自己的,還是從別的object繼承(inherit)來的,第一種方法:可以利用object.hasOwnProperty("preperty")如果console.log出的結果為true,則代表這是他自己的,反之則不是。
第二種方法直接console.log("property" in object),如果回傳true,則代表這是他自己的,反之則不是。

Accessing and Enumerating Properties on Objects這節,知道了要判斷是否enumerable,可以用for-in來判斷,雖然我不知為何一些property對特定operation隱藏這樣有什麼意義,以後等寫到再說吧。另外讓我們來說一下for-in loop在幹嘛吧。
var object = {property1, property2, property3}
for(var eachItem in object){
   console.log(eachItem);
}
如此一來就能印出object有哪些properties,var eachItem你可以把eachItem改成任意一個名字,但是我較喜歡原作者用eachItem命名,清楚解釋這是要問我們的object裡有哪些properties

Accessing Inherited Properties這節提到一個重要概念
  • Properties inherited from Object.prototype are not enumerable, so the for/in loop does not show them. However, inherited properties that are enumerable are revealed in the for/in loop iteration.
喔喔喔,Accessing Inherited Properties這節的paradigm提到個有趣的概念,如我剛剛在blogger上面寫的paradigm,有一個object裡有三個properties,現在我用function這keyword去創一個名為addValue的constructor,constrctor裡面用this.newProperty = "something",接著我們原本的object = new addValue(),當你做到這步後再用for-in loop去donsol.log會發現,object的properties會從原本的三個多出一個newProperty這個property,但要注意,實際上object裡面的newProperty這個property是新創造出來的,不是從addVaue constructor那邊inherit來的
  • the educationLevel property is not actually inherited by objects that use the HigherLearning constructor; instead, the educationLevel property is created as a new property on each object that uses the HigherLearning constructor
  • The reason the property is not inherited is because we use of the "this" keyword to define the property.
對於this的討論可以去讀這篇

接下來剩最後三節:Object’s Prototype Attribute and Prototype Property、Deleting Properties of an Object
、Serialize and Deserialize Objects。
Object’s Prototype Attribute and Prototype Property這節推薦去讀另一篇文章,所以我們啟動傳送門,去讀另一篇吧
突然想知道,醫學大師,"醫學"的英文是什麼
  • medical:醫學的、醫術的、醫療的、內科的

文章學習JavaScript Prototype in Plain Language

一開始就學習到一個重要的概念,原來property也是variable
  • know that a property is simply a variable defined on a function
首先我們來了解一些prototype的基本知識
  • there is a prototype property that every JavaScript function has (it is empty by default), and you attach properties and methods on this prototype property when you want to implement inheritance.Note that this prototype property is not enumerable: it is not accessible in a for/in loop. 

喔喔喔,接下來它介紹到一個有趣的東西,先前看code時一直不知道__proto__這哪來的,原來是假的 =..=
  • Firefox, and most versions of Safari and Chrome, have a __proto__ “pseudo” property (an alternative way) that allows you to access an object’s prototype property. You will likely never use this __proto__ pseudo property, but know that it exists and it is simply a way to access an object’s prototype property in some browsers.

接下來談到 prototype attribute
  • Think of the prototype attribute as a characteristic of the object; this characteristic tells us the object’s “parent”. In simple terms: An object’s prototype attribute points to the object’s “parent”—the object it inherited its properties from. 
在此不用中文贅述,請參考第一個paradigm與下面的敘述
  • In the example code above, newObj‘s prototype is PrintStuff.prototype.
這裡很貼心的幫我們複習一下constructor的概念
  • A constructor is a function used for initializing new objects, and you use the new keyword to call the constructor.
  • all objects that inherit from another object also inherit a constructor property. And this constructor property is simply a property (like any variable) that holds or points to the constructor of the object.

Prototype Attribute of Objects Created with new Object () or Object Literal這節提到,所有的object都是源自於Object.prototype,簡單來說所有object的parent都是Object.prototype
  • Object.prototype is the prototype attribute (or the prototype object) of all objects created with new Object () or with {}.
Object Literal就是 var newObj = {}
另外在此也幫我們複習了創造一個object可以有如下兩種寫法
var pig = new Object(); //方法一

var dog ={}; // 方法二
個人較偏好方法二的寫法,創造一個empty object,在namespace時常用這種寫法,你要給這個object加入properties、或是創一個method、或是創造constructor、或是作為prototype,再從後面加即可。

閒聊一下:我一直都滿喜歡JavaScriptisSexy這作者的illustrate方式,想說他有沒有介紹DOM,於是估狗一下,發現他有一系列文章,解釋JavaScript的各種concept,可惜DOM篇還沒寫 QQ
如果想更了解Objective Oriented Programming in JavaScript,作者滿推買這本電子書的

進度到Prototype Attribute: Accessing Properties on Objects這節,這篇內容不多,吃完晚餐看完電影回來今晚把這篇KO

最後這作者溫馨叮嚀,乾脆整段複製貼上 XD
Object.prototype Properties Inherited by all Objects
  • All objects in JavaScript inherit properties and methods from Object.prototype. These inherited properties and methods are constructor, hasOwnProperty (), isPrototypeOf (), propertyIsEnumerable (), toLocaleString (), toString (), and valueOf (). ECMAScript 5 also adds 4 accessor methods to Object.prototype.

本文閱閉,author建議想知道更多可以去讀 Chapter 6 of JavaScript: The Definitive Guide (6th Edition, May 2011) by David Flanagan

幾乎每天都在technical articles reading,容易疲勞又容易累,剛剛突然想到一個好方法,中間休息時聽英文情歌一邊看英文歌詞查單字,這樣子又可以學英文又可以放鬆專心聽一首歌,而不是regular replay like background music

明日目標:
還有要記得回去讀JavaScript Objects in DetailG 的Serialize and Deserialize Objects這節

沒有留言:

張貼留言