R紫
@hydrocephalus
Fri, Apr 19, 2019 9:02 AM
Fri, Apr 19, 2019 11:41 AM
1
忍不住發廢噗該一下
(可能晚點會刪點廢文改正經的筆記噗)
CS50 week5突入,看到CSS/HTML/JavaScript感覺真好
親切與安心感MAX
スズ
@Ting294
Fri, Apr 19, 2019 11:15 AM
恭喜!(拍手)
スズ
@Ting294
Fri, Apr 19, 2019 11:16 AM
那這週我就跟著看戲了
都沒學過
R紫
@hydrocephalus
Fri, Apr 19, 2019 11:16 AM
不考慮沾個水嗎
(不知他影片有沒有公開
看本周的作業好像是生一個網頁出來,天啊好親切的主題(流淚
象 象
@Benares
說
Fri, Apr 19, 2019 1:06 PM
其實我覺得網頁比較難寫XD
R紫
@hydrocephalus
Fri, Apr 19, 2019 1:12 PM
作業要求沒有javascript,本週佛心來著
慢心
接下來一定會有很鬼畜的展開,這可是CS50
慢心はダメ
會感覺簡單也應該只是因為作業沒開虐
R紫
@hydrocephalus
Fri, Apr 19, 2019 1:13 PM
象 象
: 主要難點是在相容方面嗎?還是不可預期的使用方式?(好好奇)
象 象
@Benares
說
Fri, Apr 19, 2019 1:19 PM
我覺得是很難 debug
C 語言有東西寫錯 build 的時候就能抓出部分問題
執行時也有滿多工具可以分析(gdb, valgrid等等)
甚至能解譯成組合語言看他實際執行什麼指令
javascript 就很難 debug
一個打錯字就可能找半天
R紫
@hydrocephalus
Fri, Apr 19, 2019 1:22 PM
錯字
這下靠北了
象 象
@Benares
說
Fri, Apr 19, 2019 1:53 PM
而且 javascript 有比較高階(抽象)的語法 不像 C 那麼直觀
ex. chain function/ lambda/ closure
要寫一個工具要不斷的查文件
編輯器的 autocomplete 通常沒法自動找到 function/member
還有網頁的 framework 更新超快
三個月流行就變一波 要不斷追新的挺累XD
雖然說很多缺點 但她還算是個方便的語言
也能做很多視覺化的東西
像是.......下紫雨(?
Coding Challenge #4: Purple Rain in Processing
象 象
@Benares
說
Fri, Apr 19, 2019 1:53 PM
放煙火
Coding Challenge #27: Fireworks!
R紫
@hydrocephalus
Fri, Apr 19, 2019 1:58 PM
追新番都不會那麼勤,果然是高年薪低時薪⋯⋯
另外這人打字也太快了吧而且全都是沒碰過的東西wwwww 被當菜虐啊
不,是真的菜
象 象
@Benares
說
Fri, Apr 19, 2019 2:01 PM
這 youtuber 滿厲害的
對圖像頭腦很清楚 才能那麼快寫出這些
這頻道很多影片都不知他做這幹啥XDDDDD
但算滿有趣的 CS50 的 javascript 學一些後可以找他的範例做做
有圖像成就感比較高
R紫
@hydrocephalus
Sat, Apr 20, 2019 1:20 PM
來了來了熟悉的真‧硬漢課程CS50
前4週被虐完沒死後看到這個結構圖竟然只是很平淡的接受了
原來網頁也是一種tree
的事實
一年前的我大概只會宇宙級別的黑人問號ㄅ
CS50: 用心良苦
R紫
@hydrocephalus
Sat, Apr 20, 2019 1:22 PM
前幾天輕率說出
html真讓人心安啊
果然只是菜逼八什麼都不懂才會講出來的天真發言wwwww
スズ
@Ting294
Sat, Apr 20, 2019 1:35 PM
所有可以畫成樹狀圖的都是啊
包含你現在正在用的檔案總管
R紫
@hydrocephalus
Sat, Apr 20, 2019 1:37 PM
之前自己啃書學html跟css的時候完全沒有這種概念,先給C洗臉還是有用的,腦袋裡儲存的概念真的有差
象 象
@Benares
說
Sat, Apr 20, 2019 3:30 PM
C語言編譯也會建tree
C 學好基礎夠 學其他語言比較容易知道在做啥XD
R紫
@hydrocephalus
Sun, Apr 21, 2019 9:44 AM
Sun, Apr 21, 2019 2:16 PM
雖然本週的課程內容是以前有試著自學過的東西,但依舊收穫滿滿
!
DHCP: 提供IP
DNS: 把數字轉成文字
PORT: 同一棟樓裡辨別不同收件人的門牌
都是聽過但其實一直沒搞得很懂的基礎
R紫
@hydrocephalus
Thu, Apr 25, 2019 11:52 AM
[JavaScript]
x = 44; → 宣告global variable x = 44
var x = 4; → local variable
欸以前都不知道,終於闢謠
R紫
@hydrocephalus
Thu, Apr 25, 2019 11:54 AM
array改用[]來宣告
e.g. var num = [0, 1, 2, 3, 4];
R紫
@hydrocephalus
Thu, Apr 25, 2019 11:56 AM
JavaScript的array竟然可以合法混裝不同型態的資料
!!!
var mixed = [0, true, 3.1415, 'text'];
R紫
@hydrocephalus
Thu, Apr 25, 2019 12:01 PM
哇出現沒看過的東西了
Object (JavaScript) 用
{}
包起來
var car = {year: 1963, model: 'Beetle'};
象 象
@Benares
說
Thu, Apr 25, 2019 12:34 PM
最後 object 可以查查看 JSON 的格式
網路傳資料也滿常用到
R紫
@hydrocephalus
Thu, Apr 25, 2019 12:45 PM
說到網路傳資料,這禮拜都在看
Welcome to The TCP/IP Guide!
結果作業一個字都還沒動www
--
JSON與Object:
[筆記] JavaScript中物件(object)和JSON格式的轉換
原來可以這樣用啊...
感謝火力支援
R紫
@hydrocephalus
Sat, Apr 27, 2019 1:54 PM
--
果然事情沒有憨人想得如此單純
37-39行正常動作
35行是想要作出
滑鼠游標移動到表格文字上,網頁背景會依照每一格裡面的色碼來改變顏色
←然而毫無反應
用javascript, mouse cursor跟background color change估狗了一下,感覺寫法都跟想做的功能微妙錯開...35行這樣寫為何不能讀呢呃呃呃...
R紫
@hydrocephalus
Sat, Apr 27, 2019 2:06 PM
姆還是應該先getId然後依照ID內容變換背景顏色...所以其實需要寫兩個功能
?
象 象
@Benares
說
Sat, Apr 27, 2019 2:40 PM
看起來頗微妙 感覺思考跳太快了XDDDD
35 的
http://this.id
看起來不會有東西 妳想取得什麼內容呢?
如果要達成你的要求 我想應該要要對每一個顏色的 td 做 onmouseover 的 event, 然後在幫 table 做對應的變色
R紫
@hydrocephalus
Sat, Apr 27, 2019 3:00 PM
理想是這樣: 滑鼠滑過去後,可以直接抓到表格中每一格的十六進位值色碼,然後網頁背景顏色變換為該色碼
35那行我是從課堂裡的code借來改的,但課堂上示範的內容是
從下拉式選單選取字型大小XX後,把某段文字的大小改成XX
←這樣
或是我應該先從
按下按鈕後改變網頁背景顏色
開始寫寫看
好像有點跳太快了,javascript的語法串成一坨其實還沒有看得很懂Orzz
R紫
@hydrocephalus
Sat, Apr 27, 2019 3:02 PM
課堂上的示範碼長這樣w
象 象
@Benares
說
Sun, Apr 28, 2019 3:04 AM
簡單範例是這樣
要知道
1. 如何選到想要的 td -> 讀 selector 的語法
2. 如何變成該 td 想要的顏色
-> 給 td 埋 data 並在 code 中取得
範例寫法每個 td 都要寫一次 moussover event, 可以再優化
R紫
@hydrocephalus
Sun, Apr 28, 2019 3:12 AM
喔喔喔謝謝大,人在外頭,回家研究研究
R紫
@hydrocephalus
Sun, Apr 28, 2019 9:13 AM
感受到什麼叫debug困難
只有FF0000的按鈕按下去會執行javascript是什麼魔術......
R紫
@hydrocephalus
Sun, Apr 28, 2019 9:16 AM
靠北改成文字(red, green, blue, white) 就正常執行
!
所以問題是#字號嗎?! 你她嗎...(自我黑人問號
R紫
@hydrocephalus
Sun, Apr 28, 2019 9:21 AM
不知道為什麼code動了/不動了
象 象
@Benares
Sun, Apr 28, 2019 10:52 AM
用chrome按f12開開發者模式看看出現什麼問題
想印log可用 console.log()
剛游完泳 回去幫妳看看怎麼回事XD
R紫
@hydrocephalus
Sun, Apr 28, 2019 10:54 AM
象 象
: 啊啊啊啊原來F12是這樣用的 (CS50: told u)
告訴你開發者模式很重要但先不告訴你他原來還可以用在這地方
太自信了我根本把CSS跟javascript都還回課本
感覺得惡補一下
R紫
@hydrocephalus
Sun, Apr 28, 2019 12:46 PM
Home page (CS50 Promblem Set 5)
這種不完全燃燒的啊砸感覺
可惡...
象 象
@Benares
說
Sun, Apr 28, 2019 12:55 PM
一看來以為是課程的 demo 頁面, 原來是妳寫的....
這就是對美感的差距嗎
話說有看到個小小 bug
在 table.html 連到 index.html 有打錯字XD
R紫
@hydrocephalus
Sun, Apr 28, 2019 12:57 PM
象 象
: 您人真是太善良
兩三年前自己搞的blog (完全從頭寫,找一個免費的獨立空間放) 比現在寫的這個華麗不知幾百倍
其實好像不只那邊有錯字,我修一下重新上傳
感謝提醒www
象 象
@Benares
說
Sun, Apr 28, 2019 1:00 PM
原來妳還從頭寫過 blog, 超 SHOCK!!
那很不簡單啊!!
R紫
@hydrocephalus
Sun, Apr 28, 2019 1:02 PM
現在應該整個掛了,也忘記當時的code我到底有沒有備份
寫好玩的啦,只有用到html跟css,更新日記就是很原始的直接更新原始碼 (太智障惹ㄅ)
拿來放UL的對戰影片
(實在是
啊對惹錯字修正了,現在應該正常了 (F5一下應該就OK了)
象 象
@Benares
說
Sun, Apr 28, 2019 1:48 PM
看起來正常了!
我看不到妳 code 怎寫 但想說提一下可能會有幫助
建議要寫出像下方這種 只要在 td 指定屬性即可
javascript 的 code 不須重複很多遍
PS. for 迴圈如果用 var 會悲劇
R紫
@hydrocephalus
Sun, Apr 28, 2019 1:56 PM
象 象
:
!!! 就是這個
大,感謝您,我就在想說這麼簡單的功能怎麼可能只能copy paste
然而就是無法找到正確的關鍵字
不過實際寫起來的內容比我想像的複雜不少hmmm
象 象
@Benares
說
Sun, Apr 28, 2019 2:12 PM
這要下關鍵字超困難XDDDD
把問題分成兩個部份想會好些
1. 取得所有 td tag 物件
2. 對這些 td tag 物件設定 event
我也查下文件才知怎寫...
for of 查了才知道, selectall 的 tr > td 是在測試XD
而且還踩了個雷 如果把 for 中的 let 換成 var 結果會不一樣
原因可能等後面課程再解釋 有點複雜XD
R紫
@hydrocephalus
Sun, Apr 28, 2019 2:16 PM
現在尷尬的是...JS被我基本全還給參考書了,看到示範碼還要再去查那到底是功能還是自定義變數
明天去公司問MIS借書來看一下好了QQ"
CS50 week6已經衝入python了
←
但這語言也太方便了吧
(震驚
象 象
@Benares
說
Sun, Apr 28, 2019 2:48 PM
python 頗好用
我在工作上都用 C & python
雖然 python 效率差了些但真的是個方便的東西
話說 js 在 CS50 就這樣一周過水就沒了喔XD
R紫
@hydrocephalus
Sun, Apr 28, 2019 3:06 PM
簡直比過水還不如,week5作業甚至只要求html跟css
剛剛看了30分鐘的week6課程+翻了下作業,不確定還有沒有js的要素
輕如鴻毛
js跟jquery應該可以弄出蠻多有趣的效果,但CS50看起來沒打算花太多時間在這上面,是不是js能在網頁上做的python都可取代啊
象 象
@Benares
說
Sun, Apr 28, 2019 3:22 PM
python 跟網頁相關只能做後端 ex. server
要做視覺呈現比 HTML+JS+CSS 複雜許多 通常只是呈現圖表 or gamedev (之前我貼的影片能看到 HTML + JS 多強)
python & js 的用途較不相同
可能 CS50 要給的是 overview, 對於不同面向的語言都介紹一下
學生之後可依照需求往想要的方向發展
R紫
@hydrocephalus
Mon, Apr 29, 2019 12:54 AM
姆果然還是術業有專攻呢
感謝您簡單又清楚的解說
我覺得CS50基本上是走一個給學生提示,然後讓大家各自摸索細節
如果說JS比較偏向做效果的話,可能被快速帶過的原因就是...網頁不美他還是可以用吧(欸
載入新的回覆
(可能晚點會刪點廢文改正經的筆記噗)
CS50 week5突入,看到CSS/HTML/JavaScript感覺真好 親切與安心感MAX
都沒學過
看本周的作業好像是生一個網頁出來,天啊好親切的主題(流淚
慢心接下來一定會有很鬼畜的展開,這可是CS50慢心はダメ會感覺簡單也應該只是因為作業沒開虐C 語言有東西寫錯 build 的時候就能抓出部分問題
執行時也有滿多工具可以分析(gdb, valgrid等等)
甚至能解譯成組合語言看他實際執行什麼指令
javascript 就很難 debug
一個打錯字就可能找半天
這下靠北了
ex. chain function/ lambda/ closure
要寫一個工具要不斷的查文件
編輯器的 autocomplete 通常沒法自動找到 function/member
還有網頁的 framework 更新超快
三個月流行就變一波 要不斷追新的挺累XD
雖然說很多缺點 但她還算是個方便的語言
也能做很多視覺化的東西
像是.......下紫雨(?
另外這人打字也太快了吧而且全都是沒碰過的東西wwwww 被當菜虐啊
不,是真的菜對圖像頭腦很清楚 才能那麼快寫出這些
這頻道很多影片都不知他做這幹啥XDDDDD
但算滿有趣的 CS50 的 javascript 學一些後可以找他的範例做做
有圖像成就感比較高
前4週被虐完沒死後看到這個結構圖竟然只是很平淡的接受了原來網頁也是一種tree的事實
一年前的我大概只會宇宙級別的黑人問號ㄅ
CS50: 用心良苦
包含你現在正在用的檔案總管
C語言編譯也會建treeC 學好基礎夠 學其他語言比較容易知道在做啥XD
DHCP: 提供IP
DNS: 把數字轉成文字
PORT: 同一棟樓裡辨別不同收件人的門牌
都是聽過但其實一直沒搞得很懂的基礎
x = 44; → 宣告global variable x = 44
var x = 4; → local variable
欸以前都不知道,終於闢謠
e.g. var num = [0, 1, 2, 3, 4];
var mixed = [0, true, 3.1415, 'text'];
Object (JavaScript) 用{}包起來
var car = {year: 1963, model: 'Beetle'};
網路傳資料也滿常用到
結果作業一個字都還沒動www
--
JSON與Object:
原來可以這樣用啊... 感謝火力支援
果然事情沒有憨人想得如此單純
37-39行正常動作
35行是想要作出滑鼠游標移動到表格文字上,網頁背景會依照每一格裡面的色碼來改變顏色 ←然而毫無反應
用javascript, mouse cursor跟background color change估狗了一下,感覺寫法都跟想做的功能微妙錯開...35行這樣寫為何不能讀呢呃呃呃...
35 的 http://this.id 看起來不會有東西 妳想取得什麼內容呢?
如果要達成你的要求 我想應該要要對每一個顏色的 td 做 onmouseover 的 event, 然後在幫 table 做對應的變色
35那行我是從課堂裡的code借來改的,但課堂上示範的內容是從下拉式選單選取字型大小XX後,把某段文字的大小改成XX ←這樣
或是我應該先從按下按鈕後改變網頁背景顏色開始寫寫看 好像有點跳太快了,javascript的語法串成一坨其實還沒有看得很懂Orzz
課堂上的示範碼長這樣w
簡單範例是這樣
要知道
1. 如何選到想要的 td -> 讀 selector 的語法
2. 如何變成該 td 想要的顏色
-> 給 td 埋 data 並在 code 中取得
範例寫法每個 td 都要寫一次 moussover event, 可以再優化
感受到什麼叫debug困難
只有FF0000的按鈕按下去會執行javascript是什麼魔術......
所以問題是#字號嗎?! 你她嗎...(自我黑人問號
不知道為什麼code動了/不動了
想印log可用 console.log()
剛游完泳 回去幫妳看看怎麼回事XD
告訴你開發者模式很重要但先不告訴你他原來還可以用在這地方太自信了我根本把CSS跟javascript都還回課本 感覺得惡補一下
這種不完全燃燒的啊砸感覺 可惡...
這就是對美感的差距嗎話說有看到個小小 bug
在 table.html 連到 index.html 有打錯字XD
其實好像不只那邊有錯字,我修一下重新上傳感謝提醒www那很不簡單啊!!
寫好玩的啦,只有用到html跟css,更新日記就是很原始的直接更新原始碼 (太智障惹ㄅ)
拿來放UL的對戰影片(實在是啊對惹錯字修正了,現在應該正常了 (F5一下應該就OK了)
我看不到妳 code 怎寫 但想說提一下可能會有幫助
建議要寫出像下方這種 只要在 td 指定屬性即可
javascript 的 code 不須重複很多遍
PS. for 迴圈如果用 var 會悲劇大,感謝您,我就在想說這麼簡單的功能怎麼可能只能copy paste
然而就是無法找到正確的關鍵字不過實際寫起來的內容比我想像的複雜不少hmmm
把問題分成兩個部份想會好些
1. 取得所有 td tag 物件
2. 對這些 td tag 物件設定 event
我也查下文件才知怎寫...
for of 查了才知道, selectall 的 tr > td 是在測試XD而且還踩了個雷 如果把 for 中的 let 換成 var 結果會不一樣
原因可能等後面課程再解釋 有點複雜XD
明天去公司問MIS借書來看一下好了QQ"
CS50 week6已經衝入python了←但這語言也太方便了吧 (震驚我在工作上都用 C & python
雖然 python 效率差了些但真的是個方便的東西
話說 js 在 CS50 就這樣一周過水就沒了喔XD
剛剛看了30分鐘的week6課程+翻了下作業,不確定還有沒有js的要素
輕如鴻毛js跟jquery應該可以弄出蠻多有趣的效果,但CS50看起來沒打算花太多時間在這上面,是不是js能在網頁上做的python都可取代啊
要做視覺呈現比 HTML+JS+CSS 複雜許多 通常只是呈現圖表 or gamedev (之前我貼的影片能看到 HTML + JS 多強)
python & js 的用途較不相同
可能 CS50 要給的是 overview, 對於不同面向的語言都介紹一下
學生之後可依照需求往想要的方向發展
我覺得CS50基本上是走一個給學生提示,然後讓大家各自摸索細節
如果說JS比較偏向做效果的話,可能被快速帶過的原因就是...網頁不美他還是可以用吧(欸