一、課程回顧
番外篇:Github靜態(tài)網(wǎng)頁(yè)搭建方法。
【理論講解】
在信息技術(shù)高速發(fā)展的現(xiàn)在,我們可以這樣理解,對(duì)人類(lèi)來(lái)說(shuō)的所有的信息都是對(duì)計(jì)算機(jī)來(lái)說(shuō)的數(shù)據(jù),因此可以想象,計(jì)算機(jī)可以涵蓋的數(shù)據(jù)的多樣化、豐富化。
一切從命名開(kāi)始
以人名舉例講解:
我們對(duì)于一個(gè)人的概念,可以說(shuō)是一堆屬性和關(guān)系的集合。包括:姓名、身高、體重、年齡……
先取名再生小孩——把名字和小孩關(guān)聯(lián)上
用名字來(lái)操縱人——小明,快去寫(xiě)作業(yè)。
從姓名開(kāi)始思考——豐富的屬性、多樣關(guān)系
名字和目標(biāo)——小明是一個(gè)具體的人,目標(biāo)是一堆屬性、關(guān)系等。
關(guān)聯(lián)名字和目標(biāo)——小明不等于一個(gè)具體的人,“小明”這個(gè)名字,只是一組數(shù)據(jù)的集合。
各種描述遞進(jìn):用格式化方式、符號(hào)化方式、偽代碼方式描述“小明”,越來(lái)越接近代碼的呈現(xiàn)?!芸炊畟未a了就能看懂代碼了
我們是如何識(shí)別人的?——記住一個(gè)人的名字與其屬性、關(guān)系的對(duì)應(yīng)信息。
程序的目標(biāo)地是什么?——“處理數(shù)據(jù)、得到結(jié)果”
首先需要對(duì)數(shù)據(jù)進(jìn)行命名(一切從命名開(kāi)始):
與C、Java等其他編程語(yǔ)言不同,JavaScript里所有數(shù)據(jù),不區(qū)分類(lèi)型,都用“var”表示
語(yǔ)句:var output = “Hello, JS”
代表:1..聲明:var output;2.定義:output = “Hello, JS”
即:聲明這個(gè)變量,變量名output,再定義這個(gè)變量,給這個(gè)變量賦值。
內(nèi)行話(huà)——“先聲明再定義”
命名方式:常用駝峰命名法,(還有帶下劃線(xiàn)的,具體內(nèi)容自己了解)
學(xué)習(xí)補(bǔ)充:變量常用小駝峰法,類(lèi)名、空間名等常用大駝峰法。
【實(shí)操部分】
分別在瀏覽器和Node環(huán)境運(yùn)行樣例,嘗試修改內(nèi)容,觀(guān)察顯示效果,對(duì)運(yùn)行環(huán)境有初步感受。
【心法記錄】
1、本課程重點(diǎn)是編程思想的講解
2、代碼不重要,掌握理解問(wèn)題、解決問(wèn)題的方法最重要。
3、一切從命名開(kāi)始——體會(huì):對(duì)于一個(gè)新的要表達(dá)、運(yùn)用的信息或數(shù)據(jù),名字起得好一定程度上代表思路、概念清晰。
4、學(xué)會(huì)、擅用畫(huà)圖的方法來(lái)進(jìn)行思考。
二、課程作業(yè)
【第二次作業(yè)】——變量和值
昨天我?guī)湍銈兪崂砹俗兞亢椭抵g的關(guān)系。下面梳理一些知識(shí)點(diǎn)供大家參考,好好利用周末的時(shí)間把這塊啃下來(lái)。
1.多樣化的數(shù)據(jù)格式(數(shù)字、文本、布爾、對(duì)象、數(shù)組)
2.多樣化的數(shù)據(jù)格式的操作方式。
以上內(nèi)容網(wǎng)上有很多教程,如果你想買(mǎi)書(shū),我推薦“JavaScript權(quán)威指南—淘寶前端團(tuán)隊(duì)翻譯的那本”
作業(yè)要求-1.熟讀getting-started-with-javascript/study/lesson2/smaple_code.js代碼。用node環(huán)境和瀏覽器環(huán)境運(yùn)行一下代碼(注意:瀏覽器運(yùn)行請(qǐng)使用my_personal_info_page.html)
作業(yè)要求-2.寫(xiě)一篇課程總結(jié),題目為:編程中為什么會(huì)有豐富化的數(shù)據(jù)格式?(我可能跑題了)
我的作業(yè)
在信息化社會(huì),數(shù)據(jù)幾乎無(wú)所不包,所有可以想象到的信息都可以用數(shù)據(jù)來(lái)記錄、存儲(chǔ)。在快速更替的時(shí)代,我們希望有更高效、高質(zhì)的工作、學(xué)習(xí)以及生活,豐富多樣的實(shí)用軟件、精準(zhǔn)高效的數(shù)據(jù)分析處理工具都再發(fā)揮著越來(lái)越重要的作用。
如此紛繁的數(shù)據(jù)交給計(jì)算機(jī)來(lái)處理,需要有規(guī)范的數(shù)據(jù)格式,即數(shù)據(jù)類(lèi)型,以便處理能力更有的放矢、更高效。
一.大類(lèi)
在JavaScript中數(shù)據(jù)類(lèi)型分為兩類(lèi):1.原始類(lèi)型、2.對(duì)象類(lèi)型。
原始類(lèi)型:包括數(shù)字、字符串、布爾值。
有兩個(gè)特殊的原始值:null(空)、undefined(未定義)。
對(duì)象類(lèi)型:對(duì)象(object),數(shù)組(array)是一種特殊對(duì)象,函數(shù)是另一種特殊對(duì)象。
二.具體說(shuō)說(shuō):
1.原始類(lèi)型:
1-1.?dāng)?shù)字:
1-1-1. JavaScript的數(shù)字均采用IEEE 754標(biāo)準(zhǔn)定義的64位浮點(diǎn)格式表示,不區(qū)分整數(shù)值和浮點(diǎn)數(shù)值(與C和Java等不同),需要注意的是:JavaScript的實(shí)際操作,整數(shù)是基于32位整數(shù)。
1-1-2. JS程序中直接出現(xiàn)的數(shù)字稱(chēng)為數(shù)字直接量(numeric literal),包括整型直接量、浮點(diǎn)型直接量。
1-1-2-1. 整型直接量:包括十進(jìn)制整型直接量、十六進(jìn)制整型直接量。某些JS的實(shí)現(xiàn)支持八進(jìn)制整型直接量,但不保證通用,因此一般不要使用八進(jìn)制整型直接量。
1-1-2-2. 浮點(diǎn)型直接量:包括傳統(tǒng)實(shí)數(shù)寫(xiě)法,例如:3.14、1.789;指數(shù)記數(shù)法,例如:6.02e23、2.987653E-32。浮點(diǎn)型直接量語(yǔ)法表示為:[digits][.digits][(E|e)[(+|-)]digits]
1-1-3. JS的算術(shù)運(yùn)算:
1-1-3-1. 基本運(yùn)算符包括加(+)、減(-)、乘(*)、除(/)和求余(%)
1-1-3-2. 復(fù)雜的算術(shù)運(yùn)算:通過(guò)Math對(duì)象的屬性定義的函數(shù)和常量來(lái)實(shí)現(xiàn),例如:Math.pow(2,3) ->8,2的3次冪;Math.ceil(.6)->1,向上求整;Math.floor(.6) ->0,向下求整。
1-1-4. JS的算術(shù)運(yùn)算在溢出(overflow)、下溢(underflow)或被零整除時(shí)不會(huì)報(bào)錯(cuò)。
1-1-4-1. 溢出(overflow):即當(dāng)數(shù)字運(yùn)算結(jié)果超過(guò)了JS所能表示的數(shù)字上限,正數(shù)時(shí)以無(wú)窮大(Infinity)表示、負(fù)數(shù)時(shí)以負(fù)無(wú)窮大(-Infinity)表示。
1-1-4-2. 下溢(underflow):即當(dāng)運(yùn)算結(jié)果無(wú)限接近于零并比JS能表示的最小值還小,此時(shí)JS會(huì)返回0。還有個(gè)“負(fù)零”概念,一般可忽略。
1-1-4-3. 被0整除,返回?zé)o窮大(Infinity)或負(fù)無(wú)窮大(-Infinity),0除以0、無(wú)窮大除以無(wú)窮大、給負(fù)數(shù)作開(kāi)方或算術(shù)運(yùn)算符與不是數(shù)字或無(wú)法轉(zhuǎn)換為數(shù)字的操作數(shù)一起使用時(shí),都將返回非數(shù)字,表示為NaN(not-a-number)。
? NaN有一點(diǎn)特殊:它和任何值都不相等,包括自身。x==NaN不能表示x是NaN,可通過(guò)x!=x判斷,當(dāng)且僅當(dāng)x為NaN時(shí),x!=x為true。
1-1-5. 二進(jìn)制浮點(diǎn)數(shù)和四舍五入錯(cuò)誤
在JS的數(shù)值范圍內(nèi),浮點(diǎn)數(shù)只能表示有限個(gè)數(shù)實(shí)數(shù),而不是一般理解的無(wú)數(shù)個(gè),會(huì)有些真實(shí)值只能近似表示。這是由于浮點(diǎn)數(shù)表示法是二進(jìn)制表示法引起,只能精確的表示2的次方分之一的值,如:1/8、1/1024,而我們常會(huì)使用十進(jìn)制分?jǐn)?shù),如:1/10、1/1000,二進(jìn)制浮點(diǎn)數(shù)無(wú)法精確表示類(lèi)似0.1這樣簡(jiǎn)單的數(shù)字。會(huì)造成運(yùn)算的尷尬,如0.3-0.2并不等于0.2-0.1。
這不是JS中才會(huì)出現(xiàn),好在精確值非常精確,一般任務(wù)都能勝任,只有在比較兩個(gè)數(shù)大小事才會(huì)遇到。以后的版本或許會(huì)針對(duì)此做改進(jìn)。如涉及重要金融計(jì)算,建議使用“分”而不是“元”作單位。
1-1-6. 日期和時(shí)間的表示:JS語(yǔ)言包括Date()構(gòu)造函數(shù),可以創(chuàng)建包括年月日時(shí)分秒的對(duì)象,進(jìn)行日期、時(shí)間的特定值提取、使用,有些特殊規(guī)范,比如月份從0開(kāi)始。
1-2. 字符串:
1-3. 布爾值:boolean,指代真或假、開(kāi)或關(guān)、是或否,類(lèi)型值只有兩個(gè):true和false。用于編程語(yǔ)言的控制結(jié)構(gòu)。通常與比較語(yǔ)句結(jié)合使用,舉例:
If(a==4)
b=b+1;
else
a=a+1;
這段代碼判斷a是否等于4,等于時(shí),b加1;不等于時(shí),a加1。
關(guān)于轉(zhuǎn)換:任意JavaScript的值都可以轉(zhuǎn)換為布爾值,其中undefined、null、0、-0、NaN、“”(空字符)六個(gè)會(huì)轉(zhuǎn)換為false(有稱(chēng)“假值”(falsy value)),其他值均會(huì)轉(zhuǎn)換為true(有稱(chēng)“真值”(truthy value))。
布爾值支持三個(gè)布爾運(yùn)算符、一個(gè)方法:”&&”(AND)、”||”(OR)、”!”(NOT) 以及toString()
2.兩個(gè)特殊的原始值:null(空)、undefined(未定義)。它們不是數(shù)字、字符串、布爾值這些原始類(lèi)型,通常代表了各自特殊類(lèi)型的唯一的成員。它們都不包含任何屬性和方法。
3. 對(duì)象類(lèi)型:對(duì)象(object),數(shù)組(array)是一種特殊對(duì)象,函數(shù)是另一種特殊對(duì)象
3-1.對(duì)象(object):(還需學(xué)習(xí)理解、補(bǔ)充)
3-2.數(shù)組(array):是值的有序集合。每個(gè)值叫做一個(gè)元素,每個(gè)元素在數(shù)組中有一個(gè)位置索引數(shù)。數(shù)組元素可以是任意類(lèi)型,也不一定是常量。數(shù)組能夠表達(dá)不同類(lèi)型的組合信息,比如一個(gè)人的相關(guān)信息等。
3-2-1.創(chuàng)建數(shù)組:
(1)數(shù)組直接量:
沒(méi)有元素的數(shù)組:var empty=[];
有3個(gè)元素的數(shù)組:var array1=[1,2,3];
3個(gè)不同類(lèi)型的元素和結(jié)尾的逗號(hào):var array2=[1,“a”,true,](數(shù)組直接量語(yǔ)法允許有可選的結(jié)尾的逗號(hào),所以是三個(gè)元素而非四個(gè))
(2)調(diào)用構(gòu)造函數(shù)Array():
沒(méi)有任何元素的空數(shù)組:var a = new Array()
指定長(zhǎng)度作為參數(shù):var a = new Array(10)——沒(méi)有存儲(chǔ)值及索引,預(yù)分配了一個(gè)數(shù)組空間。
顯式指定方式:var a = new Array(5,4,3,“test”);——這種方式不如使用數(shù)組直接量。
3-2-2.數(shù)組方法包括:join()、reverse()、sort()、concat()、slice()、splice()、push()和pop()、unshift()和shift()、toString()和toLocaleString(),前面這些是ECMAScript3中的方法,在ECMAScript5中還有forEach()、map()、filter()、every()和some()、reduce()和reduceRight()、indexOf()和lastIndexOf()
(還需在使用中逐漸深入理解)
作業(yè)要求-3. 如果有問(wèn)題,在總結(jié)中把你的問(wèn)題羅列出來(lái),我會(huì)做解答。
遇到的問(wèn)題
1、 瀏覽器運(yùn)行代碼發(fā)現(xiàn)的情況:
當(dāng)打開(kāi)my_personal_info_page.html頁(yè)面后,同一部分內(nèi)容,并未修改這部分代碼,刷新前后顯示效果不同。
修改代碼后直接點(diǎn)擊瀏覽器的刷新后“console”頁(yè)顯示:(后來(lái)試過(guò)不做任何代碼修改,直接刷新也會(huì)這樣)
想知道這是什么情況?
2、更新Fork項(xiàng)目時(shí)報(bào)錯(cuò):
需要更新老師的項(xiàng)目?jī)?nèi)容,從網(wǎng)上搜索到方法介紹(原文鏈接地址),文中介紹了網(wǎng)站和終端兩種方法。
先使用的終端方法,結(jié)果失敗了,最后一步提示報(bào)錯(cuò),后來(lái)使用了網(wǎng)站操作方式,很順利,更新成功。
終端報(bào)錯(cuò)如下圖,請(qǐng)老師幫忙分析下網(wǎng)站能成功、終端不成功是什么原因?謝謝~!
3.關(guān)于Date()函數(shù),嘗試執(zhí)行var now = new Date(),得到的返回值時(shí)間是晚于我們8小時(shí)的時(shí)間?
4.另外想問(wèn),能不能推薦個(gè)MAC用的保存網(wǎng)頁(yè)(好幾屏)為圖片的好辦法?用chrome能不能實(shí)現(xiàn)?
【附加作業(yè)要求】
1.在github上部署自己的靜態(tài)網(wǎng)頁(yè),把網(wǎng)頁(yè)地址放在總結(jié)文檔里。
在github上部署的靜態(tài)網(wǎng)頁(yè):https://fanmilir.github.io/MyPage/
【作業(yè)提交方式】
1.請(qǐng)向getting-started-with-javascript項(xiàng)目發(fā)起pull request。
https://github.com/xugy0926/getting-started-with-javascript
2.文檔格式,markdown。
3.提交homework/lesson2目錄下。