ALLISON BUCHHOLTZ-AU: Semua hak semua orang.
Selamat kembali ke bahagian.
Ia adalah bahagian kedua terakhir kami.
Ia amat menyedihkan.
Saya tidak tahu apa yang saya akan lakukan tanpa melihat kamu setiap hari Isnin.
Saya rasa kita harus just-- mungkin kita boleh hanya
bertemu di sini dan makan malam atau sesuatu.
Saya tidak tahu.
Saya akan membawa makanan dan bukan.
Kami hanya akan bercakap.
Tetapi ya, minggu depan akan menjadi bahagian terakhir kami.
>> Pada masa yang sama, anda mempunyai kuiz minggu depan.
Saya tahu saya terlupa untuk melakukan saya, seperti, dua minggu notis awal minggu lepas,
tetapi diharapkan anda semua tahu ini akan datang.
Semoga ini adalah salah satu yang terakhir ujian tengah semester untuk anda semua untuk semester.
Tetapi ia akan merangkumi semua bahan yang kami telah pergi ke atas.
Jadi ia tidak suka anda hanya boleh lupa kira-kira empat gelung atau pembolehubah.
Kerana kita belajar mereka yang pada mulanya,
yang jelas permainan yang adil untuk kuiz anda.
>> Ia akan menjadi format yang sama, sama panjang, jadi anda sudah digunakan untuk ia.
Terdapat akan menjadi pengekodan oleh masalah tangan,
mungkin sesetengah palsu benar, mungkin beberapa jawapan pendek.
Jadi, anda perlu biasa dengan format,
terutamanya jika anda mengambil ujian amalan.
Tetapi seperti yang saya katakan di sini, ia kumulatif, tetapi kami pasti
akan memberi tumpuan kepada perkara-perkara dari enam minggu seterusnya.
Jadi, kami mungkin tidak akan bertanya kepada anda tentang berapa banyak bait
berada di dalam setiap jenis atau orang macam perkara,
tetapi kita mungkin akan berada berminat dalam perkara-perkara seperti senarai dikaitkan,
atau struktur data yang berbeza, atau algoritma yang berbeza
bahawa kita telah berbincang tentang.
Jadi, pastikan anda benar-benar sehingga kepada orang-orang, dan jika anda
memerlukan sumber, di sini banyak sumber.
Saya hanya memberikan anda jenis daripada senarai yang cepat ada.
>> Minggu depan akan menjadi kuiz mengkaji semula pada masa ini.
Jadi, jika anda mempunyai sebarang soalan atau topik tertentu,
perkara tertentu pada kuiz yang anda ingin pergi ke, sila
menghantar mereka kepada saya lebih awal daripada masa jadi saya boleh sejenis menyediakan beberapa bahan untuk itu.
Dan di samping itu seksyen kajian, kita akan
juga mengadakan kursus-lebar mengkaji semula seperti yang kami lakukan masa lalu.
Dan ia akan menjadi dilakukan oleh orang yang sama.
Saya tidak tahu jika itu menjadikan ia lebih baik atau lebih teruk lagi,
tetapi ia akan menjadi saya, Hannah, Davan, dan Gabe lagi.
Jadi jika anda ingin datang melihat kami semua kelakar antara satu sama lain
dan berjalan anda melalui kuiz kajian, anda perlu pasti
datang kepada bahawa Isnin depan juga.
Jadi, anda hanya perlu kesesakan Isnin dibungkus kajian semula kuiz, yang baik
kerana anda mempunyai Selasa untuk memproses melalui segala-galanya.
>> Tetapi pasti melakukan semak daripada sumber-sumber ini.
Study.csv.net setakat ini, saya berfikir, salah satu yang paling berguna,
sebahagian besar kerana ia mempunyai banyak contoh kod,
ia mempunyai semua Mata Kuasa dengan semua nota di atas itu,
yang benar-benar apa yang saya paling menarik seksyen bahan dari saya.
Jika ada apa-apa dalam sebelumnya bahagian yang saya mungkin telah dihantar
bahawa anda tidak boleh mempunyai mendapat, hanya beritahu saya.
Seperti contoh kod minggu lepas, jika sesiapa tidak mendapatkan itu,
hanya e-mel saya atau datang bercakap dengan saya, dan saya akan memastikan bahawa anda mendapatkan yang.
>> Jadi dengan itu, hari ini kita akan menjadi bercakap tentang JavaScript.
Jadi di sini kita Tommy, yang saya hanya bercakap dengan anda malam tadi.
Saya suka Tommy.
JavaScript adalah kegemarannya bahasa, seperti katanya di sini.
Mereka akan cuba dan memberitahu anda bahawa itu bukan yang terbaik, dan mereka akan menjadi salah.
Jadi Tommy adalah pakar JavaScript.
Saya tidak cukup pada beliau tahap, tetapi saya adalah seperti,
"Tommy, bagaimana saya mengajar kanak-kanak JavaScript? "
Jadi saya mendapat beberapa tips, jadi mudah-mudahan mereka bersenam.
>> Jadi beberapa perkara yang tahu adalah bahawa JavaScript adalah skrip pihak pelanggan
bahasa, jadi manakala PHP adalah sesuatu bahawa kita dianggap lebih pelayan-sampingan,
ia telah memuat naik ke pelayan, disusun dan dibunuh.
Yang ini dilaksanakan pada mesin anda sendiri.
OK?
Jadi anda memuatkan beberapa halaman JavaScript, dan ia melaksanakan pada mesin anda.
Syntax adalah hampir sama dengan C dan PHP.
Kita akan pergi melalui beberapa contoh JavaScript,
dan anda akan melihat bahawa cara kita bercakap mengenai pembolehubah, gelung,
dan syarat-syarat semua sangat serupa.
OK?
Hakikat bahawa mereka begitu serupa adalah mungkin akan tersandung sebahagian dari kamu
sehingga, dalam beberapa kes, hanya kerana anda akan menggabungkan sedikit C
di mana sepatutnya tidak ada.
Mungkin anda cuba menaip sesuatu apabila ia tidak perlu ditaip.
>> Dan pada itu, satu perkara yang perlu tahu ialah JavaScript
adalah dinamik ditaip bahasa, seperti PHP.
Jadi, jika anda semua masih ingat daripada bahagian minggu lalu,
apabila kita melakukan jenis kursus kemalangan PHP kami,
kita melihat bagaimana satu rentetan boleh menjadi dijadikan satu int, dan sebagainya.
Jenis pembolehubah anda ditentukan pada masa jangka,
supaya mereka boleh berubah mengikut perjalanan program ini,
dan dengan cara yang sama bahawa kita tidak benar-benar mengisytiharkan jenis untuk pembolehubah PHP,
kita akan melakukan perkara yang sama perkara di sini, di mana kita tidak benar-benar
mengawal jenis pembolehubah kami, boleh dikatakan, seperti yang kita lakukan di C.
>> Dan kemudian satu perkara yang cukup keren adalah
bahawa anda boleh ralat semak melalui konsol,
dengan fungsi yang hebat ini console.log, yang
membolehkan anda untuk mencetak berbeza pembolehubah atau objek yang kita akan
bercakap tentang.
Sama seperti minggu lepas apabila saya seperti, "menggunakan fungsi ini," dengan dump
dari Serangga anda ini adalah fungsi yang anda ingin gunakan, console.log.
Saya begitu terkejut berapa banyak pelajar pada waktu pejabat
tidak tahu tentang fungsi dump.
Dan saya adalah seperti, "lelaki, kemahuan ini menjadikan kehidupan anda lebih mudah. ​​"
>> Baiklah, sehingga adalah sejenis hanya satu perkara yang ringkas, seperti biasa,
kita mempunyai contoh-contoh.
Saya tahu kamu suka kepada orang.
Jadi di sini adalah contoh yang sangat mudah JavaScript memfailkan sini.
Jadi ia hanya akan mewujudkan ini pop-up yang mengatakan,
"Hello dunia," apabila anda memasuki halaman, tetapi mari kita
cuba berjalan melalui ini sedikit.
Jadi jelas ini adalah hanya seperti index.html biasa anda.
Jadi, hanya template biasa kami di sini, dan kami mempunyai HTML, kita mempunyai kepala kita,
dan sama seperti CSS, bagaimana kita termasuk beberapa fail di luar, bukan?
Kami mempunyai beberapa jenis skrip teks yang JavaScript.
Dan sumber adalah hello.js, yang turun di sini.
Ini adalah fail keseluruhan daripada hello.js.
Dan kemudian kita mempunyai beberapa tajuk dan beberapa badan HTML
bahawa kita tidak benar-benar mengambil berat tentang.
>> Apa yang berlaku ialah, apabila kita memuatkan halaman ini, ia secara automatik melaksanakan skrip ini.
OK?
Jadi JavaScript akan melaksanakan secara automatik.
Jadi apa yang ia akan lakukan, ia akan untuk segera pergi dan melaksanakan ini.
Dan ia akan berkata, "amaran.
Hello dunia. "
Yang berjaga-jaga adalah fungsi yang sebenarnya menjana kotak ini.
OK?
Jadi, jenis merangkumi semua.
Ada apa-apa tambahan kami lakukan selain hanya amaran,
dan kemudian apa saja yang kita mahu dalam kotak Terkini.
OK?
Jadi itu hanya super mudah contoh apa JavaScript boleh buat.
>> Salah satu yang menyeronokkan! perkara, seperti yang kita akan lihat,
ialah JavaScript membolehkan anda untuk memanipulasi laman web anda,
tanpa perlu menambah nilai mereka setiap masa.
Jadi jika anda want-- contohnya, jika anda berlegar atas sesuatu,
jika anda semua pernah mempunyai dilihat seperti bar Menu,
atau apabila anda pergi ke atas beberapa topik, menu Drop-down muncul,
itulah kerana JavaScript.
OK?
Jadi anda tidak menambah nilai keseluruhan halaman untuk mendapatkan menu ini muncul,
anda hanya mencari beberapa tertentu tindakan yang pengguna telah diambil,
yang dipanggil peristiwa yang kita akan mendapat ke dalam, dan sebaik sahaja anda melihat bahawa, kamu berkata,
"OK, mengedit sesuatu di ini halaman dan membuat ia kelihatan berbeza,
tetapi hanya mengedit perkara-perkara tertentu.
Jangan memuat semula segala-galanya. "
Jadi ia sebenarnya adalah jauh lebih bagus, dan anda tidak perlu memuat semula halaman anda,
dan ia benar-benar sejuk.
>> Jadi pengisytiharan pembolehubah, jadi anda jenis boleh melihat,
Saya meletakkan di atas sini, longgar ditaip.
Jadi ini adalah sangat banyak seperti PHP.
Kami tidak perlu memberitahu JavaScript jenis kami
menjangkakan setiap pemboleh ubah ini menjadi.
Mereka boleh menjadi apa sahaja jenis yang kita mahu.
Jadi anda perhatikan dalam kes ini, kita mengisytiharkan mereka sangat mudah, hanya dengan "var"
dan kemudian apa saja yang kita mahu nama pembolehubah kami untuk menjadi.
Satu perkara yang perlu diperhatikan adalah bahawa apabila anda meletakkan var di hadapan nama pembolehubah,
ia di dalam skop ia.
OK?
Ia benar-benar murah untuk anda untuk benar-benar hanya memadam var yang
dan hanya mempunyai s sama CS50, dan yang hanya akan menjadi pembolehubah global.
OK?
Jadi, anda boleh memulakan kedua-dua cara, hanya bergantung kepada bagaimana anda mahu ia.
Jadi, jika anda Memulakan ia dalam fungsi,
dan anda mahu yang berubah-ubah untuk tinggal scoped dalam fungsi itu,
anda akan mahu lakukan sesuatu seperti var menamakan pembolehubah,
berbanding jika anda mahu global scoped, anda
hanya boleh dilakukan atas nama yang berubah-ubah dan kemudian
apa sahaja yang anda ingin ia ditetapkan sama dengan.
OK?
>> Ini adalah jenis perkara yang sejuk turun di sini, kerana jika kita lihat pembolehubah kami
b bermula sebagai benar.
Dan apa ini does-- boleh sesiapa beritahu saya apa ini melakukan?
Oleh itu, kita mempunyai beberapa amaran.
Apa yang akan menaip daripada b menjadi pada mulanya?
PENONTON: Boolean.
ALLISON BUCHHOLTZ-AU: Boolean.
Betul.
Dan kemudian kita menyerahhakkan semula b kepada rentetan ini, bukan?
Sebab itu di sini, apa jenis b menjadi?
Ia akan menjadi tali, kan?
Jadi apa yang penting kepada notis adalah bahawa dalam c, kita
boleh hampir tidak pernah melakukan sesuatu seperti itu.
Kami akan perlu mempunyai pembolehubah, membuang ia sebagai sesuatu yang lain,
mungkin melakukan beberapa fungsi dengan dua i, pergi dari suatu gadaian integer.
Tetapi jika kita lihat di sini, b sangat mudah berubah menaip.
>> PENONTON: Tunggu, jadi anda boleh hanya menjadi seperti, "membuat b integer?"
>> ALLISON BUCHHOLTZ-AU: Yeah.
Anda hanya boleh menyerahhakkan semula b kepada integer.
>> PENONTON: Betul ke?
>> ALLISON BUCHHOLTZ-AU: Yeah.
Dan kemudian ia akan menjadi satu int.
Jadi pembolehubah anda boleh berubah mengikut perjalanan program ini juga.
Mereka tidak ketat ditaip.
Ia sangat longgar ditaip.
OK?
Pada asasnya pembolehubah anda boleh melakukan apa sahaja yang mereka mahu, seperti yang kita melihat jenis dengan PHP.
Mereka boleh melakukan beberapa perkara gila, jadi ia adalah penting untuk menjadi cukup berhati-hati.
Namakan pembolehubah anda dengan baik.
Jika anda tidak, lakukan dengan tiba-tiba anda akan menjadi seperti,
"Tunggu, saya fikir ini adalah satu tali, dan kini ia int,
dan saya tidak benar-benar pasti apa yang sedang berlaku di sini. "
Jadi ini adalah hanya satu contoh yang mudah menunjukkan bagaimana pembolehubah yang boleh dengan mudah
menukar jenis ke atas perjalanan program.
>> OK.
Jadi ini harus melihat super, super biasa.
Jadi ini adalah gelung kami dalam JavaScript.
Mereka adalah sama, kecuali bukan empat int i sama dengan sifar,
kita hanya boleh mengatakan var i sama dengan sifar.
Dan kemudian kita boleh mempunyai jenis yang sama kami keadaan, jenis sama kemas kini,
i plus plus lagi boleh digunakan.
Jadi merangkak adalah sama, whiles adalah sama,
dan melakukan whiles adalah sama.
Semacam sama format umum.
Kita menyedari, empat, kurungan, kurungan, itu semua yang sama.
Juga akan ada koma bertitik apabila kita dapat kod contoh.
Anda akan melihat ia cukup lebih kurang sama dengan c.
>> Untuk pengisytiharan fungsi, sekali lagi, hampir sama.
Kami mempunyai beberapa fungsi yang hanya mengatakan bahawa itu fungsi, dan kemudian
nama kami fungsi, dan input.
Dan sekali lagi jika kita lihat, kita tidak mempunyai jenis sini jua.
Betul?
Kami mempunyai apa-apa mengatakan bahawa ini perlu ints atau beregu, atau terapung.
Mereka boleh menjadi apa sahaja yang mereka mahu.
Apa yang penting adalah perasan yang kita perlu menulis fungsi terlebih dahulu
membiarkan JavaScript tahu bahawa ini sebenarnya fungsi.
>> Jadi ini adalah hanya beberapa jumlah wang mudah fungsi yang mengembalikan x atau y,
dan kemudian apa yang juga sejuk adalah bahawa anda boleh sebenarnya
menguntukkan fungsi kepada pembolehubah.
Jadi dalam kes ini, jumlah kini fungsi yang benar-benar tidak jumlah wang.
Jadi, jika anda perhatikan di sini, kami mempunyai fungsi, nama fungsi, input.
Betul?
Di sini kita hanya mempunyai fungsi dan input.
Jadi ini dipanggil fungsi tanpa nama.
Dan ini adalah sesuatu yang harus baru untuk sebahagian besar daripada anda semua, jika tidak semua.
Jadi, pada asasnya apa yang cara ialah kita tidak
perlu nama kami fungsi dalam kes ini.
Kami hanya boleh berkata, "OK, saya akan mempunyai fungsi ini yang melaksanakan, di sini
merupakan input, dan di sini apa yang ia akan lakukan. "
Dan terutamanya apabila anda memberikan fungsi kepada beberapa pembolehubah
bahawa anda akan memanipulasi, anda tidak semestinya
perlu menamakan ia kerana anda akan merujuk
kepadanya oleh pembolehubah ini nama, tidak kira dengan apa jua
fungsi itu sebenarnya dipanggil.
OK?
>> Oleh itu, jika kita lihat di sini, kita mempunyai beberapa jumlah pembolehubah sekarang
yang adalah sama dengan sebanyak tiga dan lima.
Dan kita akan mendapatkan ini.
Dan ini hanya akan mempunyai beberapa amaran, tiga ditambah lima bersamaan dengan nombor.
Plus ini hanya akan menyatukan apa jawapan kita adalah ke tali.
Juga sejuk, plus dapat menyatukan tali.
>> Untuk JavaScript, seperti PHP, HTML, CSS dan seperti yang kita berkata,
banyak itu kita jenis sedang mengambil roda latihan luar di sini
dan anda semua mempunyai banyak pengetahuan yang bagaimana untuk benar-benar memahami perkara-perkara ini.
Mereka yang sedikit berbeza, tetapi mereka tidak begitu asing
dan bahawa anda tidak boleh di Google benda atau melihat mereka dalam talian dengan sekolah w3.
Dan kami benar-benar mengharapkan anda lelaki ke, jenis, eksperimen
dan belajar sendiri.
Jadi, saya tahu ini mungkin kelihatan sedikit kurang teliti daripada beberapa perkara yang c
yang kita lakukan, tetapi itu sebenarnya untuk sesuatu alasan.
Tetapi mudah-mudahan ia tidak terlalu yang berbeza, dan ia tidak menggalakkan.
>> Jadi dalam tatasusunan JavaScript, lagi sangat, sangat serupa.
Betul?
Kami mempunyai beberapa pelbagai pembolehubah itu sama dengan kurungan kosong,
dan itu hanya array kosong.
Ini seringkali dipanggil notasi pelbagai literal.
Itu hanya satu perkara yang kami memanggilnya.
Jika kita lihat pelbagai dua di sini, kami mempunyai beberapa pelbagai literal yang mempunyai tiga elemen,
hak?
Dan kemudian kita mempunyai beberapa Elemen ketiga var itulah
beberapa pembolehubah yang hanya akan memegang tali ini, JS.
>> Unsur-unsur, baik untuk melihat, dipisahkan dengan tanda koma,
seperti yang kita jangkakan.
Dan anda juga boleh mengakses ini, seperti yang kita lakukan dalam C, dengan tatatanda indeks ini, bukan?
Jadi berbeza dari PHP sekarang, kita akan kembali
kepada hanya jenis merujuk kepada perkara-perkara dengan indeks.
Sama seperti C, ia juga indeks sifar.
Saya rasa seperti ia akan menjadi benar-benar kejam jika mereka tiba-tiba dibuat JavaScript satu
indeks, dan anda mempunyai untuk benar-benar memikirkan semula bagaimana anda berfikir tentang tatasusunan.
>> Satu perkara yang sejuk adalah bahawa bukan mempunyai untuk do-- jika anda pernah
mahu panjang array, mungkin anda melelar melaluinya
sehingga anda menemui beberapa akhir, atau anda hanya akan tahu apa yang ia adalah.
Kerana JavaScript adalah sangat longgar dalam lebih cara daripada jenis sahaja, seperti yang kita lihat di sini,
kita hanya boleh membuat pelbagai ini lebih besar kerana kita membuat keputusan untuk.
Jika kita lihat pelbagai tiga mempunyai tiga perkara untuk memulakan,
tetapi kemudian tiba-tiba, kami seperti, "oh, hanya bergurau.
Kami sebenarnya pergi untuk menjadikannya 101 perkara. "
Jadi, jika anda pernah ingin tahu panjang sebenar pelbagai anda,
anda melakukannya seperti ini.
Dan kita akan lihat banyak tatatanda ini dalam contoh-contoh,
tetapi dengan JavaScript ia biasanya apa sahaja
objek yang anda bercakap tentang dot jenis apa fungsi
anda mahu digunakan padanya.
OK?
>> Jadi dalam kes ini, kami objek adalah array dua,
dan kita katakan kita mahu panjang array dua.
Jadi ini hanya memanggil seperti panjang lebar mengenai itu.
Dan yang akan kembali panjang anda.
Juga sesuatu yang perlu diberi perhatian adalah bahawa jika kita lihat tatasusunan kami,
tidak seperti C, mereka tidak mempunyai untuk menjadi semua jenis yang sama.
Ini jauh lebih seperti PHP.
JavaScript pada asasnya sama seperti meld ini menarik C dan PHP.
Oleh itu, kita akan masuk ke dalam itu.
Buat masa ini, mari kita hanya menganggap bahawa tatasusunan anda pada dasarnya
seperti C tatasusunan, dalam yang mereka sifar diindeks.
OK, supaya segala-galanya.
Anda juga boleh hanya melanjutkan array untuk apa indeks anda mahu.
Manakala ini mungkin akan seg kesalahan pada anda atau memberi anda beberapa kesilapan,
JavaScript adalah seperti, "nah, ia adalah baik.
Saya mendapat ini.
Kami hanya akan pergi terus di mana anda mahu. "
>> OK, jadi objek adalah sangat penting.
Anda semua akan menggunakan banyak ini dalam set P anda, jika saya ingat dengan betul.
Jadi perkara bahawa ini adalah sama seperti dalam C adalah structs.
Jadi, anda boleh berfikir about-- apabila kita pergi kepada contoh hak
selepas ini, saya fikir ia akan membuat lebih banyak sense--
tetapi pada dasarnya kita menggunakan objek untuk menyusun maklumat kursus yang berkaitan.
Apabila kita bercakap tentang structs dalam C, kita sering
bercakap mengenai seorang pelajar yang mempunyai beberapa nama, ID, rumah, anda tahu, kepekatan.
Dan itulah jenis perkara yang sama yang kita gunakan untuk objek di sini.
Ia hanya untuk menganjurkan maklumat yang sama.
>> Anda juga boleh memikirkan ini sebagai lebih sama dengan bersekutu dalam tatasusunan PHP.
Jadi ini akan menjadi jenis perkara yang di mana kita mempunyai beberapa kunci dengan nilai tertentu,
hampir sama dengan PHP.
Jadi, anda boleh memulakan beberapa objek kosong, seperti yang kita lihat di sini,
hanya dengan pendakap kerinting.
Tatasusunan Jadi adalah penyangga persegi.
Objek kosong adalah pendakap kerinting.
Perbezaan yang baik untuk mempunyai.
Dan ini adalah hanya dua yang berbeza cara untuk menetapkan ciri-ciri.
Jadi ini adalah jenis lebih daripada cara yang
adalah sama dengan PHP, dengan kami array bersekutu, dengan utama kami,
dan nilai kami, sedangkan satu ini is-- anda akan
lihat ini lebih banyak dalam JavaScript.
Ini cenderung untuk menjadi konvensyen itu.
Dan dengan cara yang sama yang kita lakukan array dua panjang dot, ini mengatakan,
"OK, saya memberikan ini atribut objek ini. "
Betul?
Jadi cara yang sama ia adalah seperti, "berikan saya panjang atribut array dua, "
ini berkata, "berikan saya beberapa harta objek kosong kami. "
Atau dalam kes ini, kita memberikan ia kepada beberapa nilai di sini.
Tetapi anda juga boleh mengaksesnya dengan cara itu.
>> Dan kemudian di sini ini adalah hanya menunjukkan dua isyarat yang berbeza.
Jadi ini akan menunjukkan isyarat akan sama tepat,
ia hanya dua cara yang berbeza mengakses elemen yang kita mahu.
Adakah ini masuk akal untuk semua orang?
Saya rasa seperti ini mungkin lebih masuk akal,
hanya kerana kami datang dari PHP.
Tetapi seperti yang kita lakukan lebih contoh, ini adalah benar-benar sama.
Banyak ia hanya berubah dalam sintaks.
>> OK, jadi contoh.
Saya suka contoh.
Jadi di sini adalah beberapa CS50 pembolehubah yang objek,
dan kami menyimpan semua ini maklumat mengenainya.
Oleh itu, kita mempunyai kursus, pengajar, TFS, psets, dan dirakam.
Jadi kita lihat ini adalah hampir semua jenis yang berbeza.
Betul?
Jadi objek boleh menyimpan atribut dari jenis yang berbeza.
Kita boleh memikirkan this-- itu sangat serupa dengan array bersekutu kami dalam PHP.
Jadi, kunci, nilai, utama, nilai, utama, nilai, sebagainya dan sebagainya.
Apa yang juga menarik dengan cara yang sama bahawa kita boleh mempunyai tatasusunan dalam tatasusunan,
kita juga boleh mempunyai objek dalam objek, atau objek dalam tatasusunan.
Anda benar-benar tidak pernah terhad kepada hanya satu pun perkara.
Kita boleh mendapatkan sangat Inceptionesque, hanya menjaga pergi ke bawah lubang arnab di sana.
>> Oleh itu, jika kita lihat, kita mempunyai beberapa kursus yang
adalah rentetan, pengajar itu rentetan, dan mudah, int, dan Boolean.
Jadi semua perkara-perkara yang berbeza.
>> Baiklah, jadi, kami mempunyai satu sama lain.
Jadi dalam kes ini, kita mempunyai pelbagai objek.
Jadi hanya suka objek boleh mempunyai pelbagai di dalamnya.
Kami juga boleh mempunyai pelbagai objek.
Ini mungkin berguna untuk berfikir tentang sama dengan jenis
bagaimana kita mempunyai hash yang jadual, kami mempunyai array
semua ini berbeza jenis structs yang
adalah petunjuk untuk berbeza nod dan barang kecil.
Tetapi dalam kes ini, kita mempunyai pelbagai objek.
Jadi ini adalah seperti array tatasusunan bersekutu.
Oleh itu, kita mempunyai beberapa elemen pertama akan menjadi objek dengan nama James
dan menempatkan Winthrop.
>> Kamu mungkin ingat sesuatu yang hampir sama dengan ini
dengan Serangga terakhir anda, di mana jika anda ditarik sesuatu dari pangkalan data anda,
jenis pertama perkara yang sedang anda adalah
semua maklumat tentang pengguna pertama yang bertemu ia,
dan kemudian anda terpaksa ke dalam indeks yang untuk mendapatkan saham mereka atau cache mereka
atau barang kecil.
Jadi ini adalah lebih kurang sama perkara, hanya perubahan kecil
dalam sintaks, sedikit perubahan dalam perkataan yang kita gunakan untuk menggambarkan mereka.
>> Jadi, jika kita mahu, boleh sesiapa beritahu saya apa amaran ini akan dilakukan di sini?
Atau apa yang sedikit ini kod akan lakukan untuk kita?
PENONTON: Ia akan memberikan anda semua nama-nama.
ALLISON BUCHHOLTZ-AU: Betul, jadi ia hanya akan memberi amaran dengan semua nama-nama
kerana ia akan melalui kampung i, jadi ia akan mula pada sifar.
Jadi ia akan berkata, OK kita cari pada objek pertama ini, yang
adalah slot yang pertama yang sedang kami.
Dan ia berkata, "berikanlah kepadaku sifat, nama objek itu. "
Jadi kita pergi di sini, kita akan scan, kita akan mencari nama,
dan kita akan mencetak James, Molly, dan Carl.
Sebarang soalan setakat ini?
JavaScript malangnya anda akan menjadi
melakukan banyak daripada melihat ke atas pada anda sendiri, memikirkan sintaks,
bergelut dengan ia.
Tetapi sudah tentu saya sentiasa di sini, waktu pejabat sentiasa di sini.
Saya mungkin pada hari Selasa minggu ini.
Jadi, jika anda berada di sana, anda boleh datang melawat saya minggu ini.
Ia akan menjadi besar.
>> OK, jadi DOM adalah Dokumen-Objek Model.
Jadi ini adalah hanya satu cara yang yang kita suka untuk berfikir
tentang bagaimana HTML kami dan segala-galanya dalam tempoh ia dianjurkan.
Ini adalah sangat banyak sesuatu yang mungkin akan datang pada kuiz anda.
Saya tahu saya tahun, ia adalah seperti di sini Fail HTML, mengisi DOM untuk itu.
Dan anda Hanya masukkan perkara-perkara kecil.
Ini sepatutnya menjadi titik mudah diharapkan.
Mudah-mudahan anda akan see--
>> PENONTON: [didengar]
>> ALLISON BUCHHOLTZ-AU: Jadi anda melihat pokok ini di sini?
>> PENONTON: Yeah.
>> ALLISON BUCHHOLTZ-AU: Maka mereka akan bertanya penggunaan
mengisi apa yang berlaku di bawah badan.
Mungkin di bawah badan, kita mempunyai beberapa divs atau kita mempunyai beberapa perenggan,
dan kami akan meminta anda untuk mengisi pokok sangat seperti ini.
Oleh itu, kita juga akan berjalan melaluinya.
Jadi Dokumen-Objek Model hanya cara yang
untuk menstruktur dan berfikir tentang kami HTML secara grafik.
Dan juga apabila kita mendapatkan menjadi lebih JavaScript,
ia akan menjadi cara yang kita sebenarnya
memanipulasi berbeza elemen pada halaman.
Kita memerlukan cara untuk mengakses setiap satu perkara dalam HTML kami,
dan jadi ini memberi kita sangat cara standard konkrit
di pelbagai laman web untuk melakukan itu.
>> Jadi, jika kita hanya berjalan melalui ini di sini, sudah tentu
dokumen kami adalah seperti keseluruhan fail kami.
Yang jelas masuk akal bahawa ia adalah perkara yang paling tinggi,
dan kemudian kita mempunyai HTML sebenar kami, yang sepadan dengan tag ini di sini.
Juga jika anda dalam inden tag anda dengan betul, kemudian mewujudkan pokok DOM ini
menjadi super mudah.
Oleh itu, kita mempunyai beberapa kepala di sini.
Kami mempunyai beberapa badan yang kita lihat stem kira HTML,
itulah sebabnya kita mempunyai kepala dan badan.
Dalam kepala, kita mempunyai beberapa tag tajuk, berakhir tag tajuk,
jadi kita tahu bahawa datang selepas kepala.
Dan dalam tag tajuk kita, kita mempunyai hello, dunia.
OK?
Jadi itulah ini seluruh cawangan tangan kiri.
Dan kemudian untuk cawangan kanan di sini, kita melihat bahawa kita mempunyai HTML,
OK kita telah melakukan bahagian kepala ini, kita cari hanya di badan,
jadi kami mempunyai beberapa kawasan badan.
Dan dalam tempoh itu, hanya perkara yang kita ada adalah hello, dunia.
OK?
Jika kita mempunyai perkara-perkara seperti beberapa p kurungan dan kemudian
hello, dunia, dan kemudian yang lain pendakap p daripada selamat tinggal, dunia,
kita akan mempunyai dua buih datang dari dari sini.
Kerana mereka kedua-dua di bawah badan, tetapi mereka perenggan berasingan kes ini.
Pasti ada amalan pada yang dalam kuiz sebelumnya,
serta banyak talian di atasnya.
OK jadi, ini hanya membolehkan kita melihat segala-galanya dengan baik
dan memanipulasi perkara sangat sistematik.
OK?
Kita tahu bagaimana untuk berjalan di pokok ini,
supaya kita tahu apa yang kita mahu untuk mengakses.
>> OK jadi ini adalah mengapa kita mahu untuk mempunyai ini jenis model,
supaya kita boleh menggunakan perkara-perkara seperti ini, dan kami faham apa yang mereka maksudkan,
dan mereka yang seragam dalam semua perkara yang kita lakukan.
Jadi tajuk dokumen dot hanya tajuk our-- semua ini
adalah cukup sendiri penjelasan, Saya suka berfikir.
Tiga Jadi yang pertama contoh hanya berkata,
"OK, hanya memberi saya tajuk halaman web ini. "
Jadi ia akan memberikan anda apa sepadan dengan tajuk.
>> Badan Dokumen dot akan memberikan anda apa yang ada dalam tag tersebut badan.
Jadi, anda boleh memanipulasi itu.
Dan dokumen badan dot dot masukkan HTML adalah satu yang sangat sejuk,
dan mungkin tidak seperti super intuitif, tetapi HTML dalaman
sepadan dengan hak ini di sini.
Jadi, jika anda pernah mahu memanipulasi teks pada halaman,
biasanya anda akan melakukan sesuatu dengan badan dot HTML dalam.
OK?
Jadi HTML dalaman cenderung untuk merujuk kepada apa yang sebenarnya antara tag.
OK?
Dan kemudian fungsi yang berguna.
Jadi, jika anda mahu untuk mendapatkan mana-mana, apa-apa unsur,
kami mempunyai beberapa ID, kelas nama, atau nama tag.
Ini adalah hampir sama dengan perkara yang kita lakukan dengan CSS, bukan?
Jika kita mempunyai beberapa pemilih yang sesuai dengan sama ada tag, kelas
yang kita berikan kepada mereka, atau ID.
Ini adalah sangat banyak cara yang sama.
Jika anda mempunyai sesuatu yang mempunyai beberapa kelas anjing,
dan anda mengatakan mendapatkan unsur-unsur dengan nama tag, dan anda meletakkan anjing di there-- atau maaf,
nama kelas.
Anda boleh meletakkan titik di sana.
Ia akan kembali semua orang-orang unsur-unsur untuk anda yang mempunyai kelas itu.
Jadi, anda boleh memanipulasi hanya mereka.
Dengan cara yang sama, mungkin anda hanya ingin memanipulasi beberapa header, jadi
beberapa header h1, seperti yang kami lakukan.
Anda boleh melakukan mendapatkan unsur-unsur mengikut label menamakan, kerana h1 adalah tanda nama.
Dan dengan cara yang sama, jika anda ingin mendapatkan beberapa perkara yang unik, anda boleh melakukan get tag.
Dapatkan unsur oleh Id.
Dan mereka sebenarnya banyak ini.
Ini adalah hanya seperti tiga daripada sangat banyak.
Jadi, jika anda berada dalam talian, sebagai Saya akan menggalakkan
anda lakukan, dan melakukan beberapa penyelidikan sendiri,
Saya pasti mengesyorkan mengkaji semua orang-orang.
Mereka boleh menjadi super berguna, terutama apabila
anda mahu hanya jenis memanipulasi perkara yang sangat khusus tanpa
pergi melalui dan cuba dapat menghuraikan segala-galanya.
>> OK, jadi perkara terakhir JavaScript adalah acara.
Oleh itu, apabila saya bercakap lebih awal tentang pergi ke laman web,
dan apabila anda pergi ke atas sesuatu, atau tetikus anda berlegar atas sesuatu,
sesuatu yang lain berlaku.
Ini adalah apa yang kita ingin fikirkan sebagai peristiwa.
Jadi apa yang kita ada kekuatan yang berguna di sini adalah onclick.
Jadi saya adalah pada hover, yang, saya cukup pasti, hanya pada hover.
Juga satu tan ini yang anda boleh mencari.
Ada senarai keseluruhan talian satu perkara yang berbeza
bahawa anda boleh mendengar.
>> Tetapi peristiwa-peristiwa JavaScript adalah pada dasarnya hanya bertindak balas kepada perkara-perkara
yang pengguna anda lakukan.
Betul?
Jadi pengguna anda tidak sesuatu, itu acara,
JavaScript dan akan bertindak balas Walau bagaimanapun anda ingin kepada.
Ia akan bertindak balas dengan sewajarnya.
Jadi dalam kes ini, kita mempunyai beberapa onload tetingkap titik.
Jadi apa ini mengatakan adalah, "tunggu sehingga dimuatkan tetingkap ini. "
OK?
Oleh itu, apabila semua ini dimuatkan, onload, maka anda boleh melaksanakan fungsi ini.
Oleh itu, apabila segala-galanya dimuatkan, anda akan
mempunyai beberapa butang carian yang mendapat unsur oleh Id,
dan ia mencetak apa sahaja yang elemen adalah seperti butang Cari.
Dan kemudian kita boleh ubah ini, kita berkata, "OK, onclick."
Oleh itu, apabila kita mendengar bunyi klik pada butang Cari,
melaksanakan fungsi ini, yang merupakan amaran, anda klik butang Cari.
>> Jadi apa yang berlaku is-- ini adalah bagus perwakilan grafik sedikit di sini.
Jadi beban dokumen kami, itulah onload kami,
kita dapati Cari kami butang, yang ini.
Kami mencari butang Cari kami.
Dan kemudian apabila butang Cari adalah klik, ia sepadan dengan di sini.
Onclick.
Kemudian kami akhirnya memberi isyarat kepada pengguna kami, yang merupakan talian ini lalu di sini.
OK?
Jadi setiap orang hanya empat langkah sepadan dengan empat kotak
di bawah sana di bahagian bawah.
Adakah ini masuk akal untuk semua orang?
>> Dan kemudian satu perkara yang saya hanya akan lagi sangat, sangat ringkas, saya yang
menggalakkan anda semua untuk pergi melihat lebih ke dalam adalah
jQuery, yang hanya perpustakaan yang dibina di atas JavaScript.
Ia adalah super berguna, sebagai dengan kebanyakan perpustakaan.
Terdapat banyak fungsi.
Oleh itu, jika ada sesuatu yang pernah yang anda mahu lakukan dalam JavaScript,
naluri pertama anda tidak perlu untuk berfikir
daripada, "apa fungsi perlu Saya kod? "Ia harus,
"Supaya aku dapat melihat orang itu telah dilakukan ini untuk saya. "
Kerana sembilan kali daripada sepuluh, seseorang akan melakukannya sudah,
dan mereka mungkin telah dilakukan dengan lebih baik.
Orang menghabiskan banyak masa melakukan ini, JavaScript dan digunakan secara meluas,
jadi orang yang sentiasa cuba untuk menjadikannya lebih baik.
JQuery dan mempunyai banyak fungsi yang mungkin akan berguna untuk anda
dalam projek akhir anda jika anda melakukan apa-apa dengan reka bentuk web.
Seperti yang saya ingin mengatakan, "kerja lebih bijak, bukan lebih keras. "
Jika kamu berbuat demikian, ia akan menjadi besar.
Apabila kita berada di hackathon yang saya tidak lakukan mahu anda untuk menjadi semua tertekan.
Saya mahu anda menjadi seperti, "Saya mendapat ini. jQuery ini mendapat belakang saya.
Saya tidak perlu menulis fungsi-fungsi ini. "
>> Jadi hanya dua perkara yang ingat, saya akan
untuk memberitahu anda lelaki kelihatan lebih ke dalam jQuery pada anda sendiri.
Semua saya akan katakan adalah ia melakukan beberapa perkara yang cukup menggerunkan
dan boleh membuat hidup anda dengan lebih mudah.
Tetapi apa yang anda mahu mempunyai apa sahaja fail
bahawa anda akan menggunakannya dalam, anda akan mahu kedua-dua baris.
Anda akan mahu skrip js jQuery dot js.
Dan sebenarnya sumber anda akan menjadi beberapa URL.
Jika anda di Google jQuery, Google sebenarnya menjadi tuan rumah semua fail untuk anda.
Jadi, anda pasti mahu input yang bukan URL.
Saya hanya meletakkan ini di sini demi kesederhanaan ini.
Semua ini bermakna di mana untuk mencari perpustakaan jQuery anda.
Ia adalah besar, jadi anda tidak mahu untuk menjadi tuan rumah pada komputer anda sendiri
jika anda boleh mengelakkan ia, itulah sebabnya kita cenderung untuk hanya meletakkan di Google URL yang
menjadi tuan rumah semua fail-fail ini untuk anda.
OK?
Anda di Google, saya berjanji ia akan berada di sana.
>> Dan kemudian apa JavaScript fail yang anda
menggunakan, jadi ini adalah hanya sebahagian luaran JavaScript fail yang anda gunakan.
Dengan cara yang sama bahawa kita pautan ke CSS kami fail, ini adalah jenis yang sama perkara.
Ini hanya link ke fail di mana anda JavaScript.
Dan saya mempunyai beberapa contoh JavaScript dengan mudah.
Oleh itu, kita akan pergi melaluinya.
Dan kemudian dalam indeks anda JavaScript, yang anda JavaScript memfailkan di sini,
ini adalah jenis pembalut bahawa anda mempunyai untuk jQuery.
Anda hampir 99.9 peratus daripada masa yang akan
untuk mempunyai ini dalam fail index.js anda.
Kerana apa ini mengatakan adalah, "Tidak melaksanakan apa-apa
sehingga dokumen anda sebenarnya bersedia, "yang adalah apa yang anda mahu.
Kerana jika dokumen anda tidak bersedia, jQuery dan mula melakukan perkara-perkara,
ia hanya kacau-bilau.
Jadi, anda sentiasa mahu mempunyai pembalut ini.
Dan kemudian untuk perkara-perkara yang pergi di sana, saya biarkan untuk perusing guys anda sendiri.
>> OK, jadi adakah apa-apa soalan betul kini kira-kira JavaScript secara umum?
Atau model DOM itu?
Jika tidak, kita mempunyai beberapa sejuk contoh-contoh yang kita boleh pergi melalui,
bahawa anda semua boleh membantu saya kod.
Tetapi saya juga akan menjadi super baik, dan jika anda
tidak mahu berkata apa-apa untuk ini, itulah denda.
Saya juga boleh hanya memberikan anda contoh.
Tetapi apa-apa pada PowerPoint sebelum kita bergerak?
Cool.
>> Saya rasa seperti anda semua perlu tenaga.
Jadi saya fikir kita akan mula dengan contoh pihak saya terlebih dahulu.
Kami mempunyai tiga contoh, anda mempunyai pilihan anda.
Oleh itu, kita mempunyai jam, di mana kita akan untuk melaksanakan jam sebenar itulah
akan mengemas kini seiring berjalannya waktu.
Kami mempunyai fungsi Twitter yang hebat ini.
This-- anda tahu apa, berpegang.
Kami akan membuat ini pergi.
Bam.
OK.
>> Kami mempunyai fungsi Twitter yang hebat ini di sini, bahawa- saya tahu, bukan?
Ia akan menjadi besar.
Adakah anda semua teruja?
Yang akan mengira jumlah aksara yang anda telah meninggalkan,
jadi jika saya menaip sekarang, Jelas sekali ia masih mengatakan 140,
tetapi kita tahu itu bukan kes itu.
Dan kemudian dengan terkini kami di sini, klik di sini untuk berparti.
Apa yang akan berlaku adalah apabila kita klik, latar belakang ini
akan berubah warna.
Jadi, anda semua mempunyai pilihan anda yang mana yang anda mahu lakukan dahulu.
Saya berjanji saya akan mengambil ia sangat mudah pada anda.
Saya rasa seperti semua orang adalah jenis hanya sangat rendah utama hari ini.
Jadi saya akan berjalan anda melalui cara kami akan melaksanakan semua ini.
Jika anda ingin temurun dalam, itu hebat, tetapi saya
rasa seperti semua orang adalah sedikit letih.
Jadi saya hanya akan berjalan anda melalui contoh-contoh.
Adakah kita mempunyai sesuatu yang kami ingin lakukan dahulu?
Sesiapa sahaja?
Tiada keutamaan?
OK.
Anda tahu apa?
Kami di pihak.
Saya rasa seperti anda semua perlu little-- yang jadi, kami akan melakukan satu pihak yang pertama.
OK.
>> Jadi apa yang kita ada here-- itulah tidak sepatutnya berada di sana.
Sekarang ia baik.
OK.
Jadi apa yang kita ada di sini adalah hanya laman HTML yang mudah
bahawa kamu semua harus super biasa dengan dua daripada anda psets lepas.
kita mempunyai jenis doc kami di sini.
Semua orang boleh lihat?
OK.
Cool.
Kami mempunyai HTML kami jelas.
Kami mempunyai beberapa header yang dikaitkan dengan lembaran gaya yang
hanya dibuat fon saya bagus dan besar dan berani.
Jadi jangan risau tentang itu.
>> Kami mempunyai beberapa badan dengan latar belakang Id, OK?
Kerana kita akan menjadi menukar latar belakang.
Oleh itu, apabila kita mengubah latar belakang dalam badan kita,
kita ingat dari dua minggu yang lalu apabila kita berurusan dengan laman web.
Jadi baik untuk mempunyai yang.
Dan kita mempunyai beberapa Id sama parti.
Ini h paun ref hanya bermakna ia akan pergi ke halaman yang sama.
Dan klik di sini untuk parti, itulah sebabnya apabila kita klik,
ia harus menukar warna, bersyukur.
>> Dan kemudian kita mempunyai beberapa skrip di sini bahawa hanya dikaitkan dengan parti ini js dot
fail, yang kosong kerana kita tidak berbuat apa-apa lagi.
Dan ia begitu sedih.
Tetapi tidak lama lagi, ia akan berubah warna, dan ia akan menjadi hebat.
>> Jadi, saya hanya akan berjalan anda semua melalui bagaimana kita boleh mendekati ini.
Jadi perkara pertama yang kita mungkin mahu lakukan,
jika kita menukar latar belakang badan, perkara pertama yang kami mungkin mahu
lakukan adalah sebenarnya merebut apa badan itu, bukan?
Oleh itu, kita mahu mempunyai jumlah wang, kami latar belakang, dan jika anda perasan,
Saya hanya secara automatik hanya mula menaip.
Tidak ada yang istimewa yang kita perlu lakukan untuk fail JavaScript kami.
Saya boleh mula mengisytiharkan pembolehubah, dan mengisytiharkan fungsi rawak.
Dan ia bentuk yang lebih bebas.
Ia seperti dengan C, yang telah kami berikan semua peraturan-peraturan ini keras, dan anda membesar,
jadi kami seperti, "keluar.
Menjadi percuma.
Melakukan apa yang anda mahu. "
Dan itulah yang JavaScript.
Oleh itu, kita mempunyai beberapa latar belakang di sini.
Dengan model DOM kita, kita tahu kita boleh buat dokumen dot mendapatkan unsur,
dan jika kita lihat di sini, badan kita mempunyai Id satu.
Betul?
Oleh itu, kita boleh mendapatkan dokumen yang oleh Id, dan inilah salah satu yang mudah.
Apa Id kita yang kita mahu di sini?
PENONTON: Latar Belakang.
ALLISON BUCHHOLTZ-AU: Latar Belakang.
Perfect.
Dan koma bernoktah di hujung.
Yang belum hilang lagi.
Anda masih memerlukan koma bertitik anda.
OK.
Jadi itulah yang pertama kami.
Dan apabila kita klik sesuatu, kita mahukan sesuatu yang berlaku, bukan?
Oleh itu, kita mungkin mahu beberapa pembolehubah yang yang menunggu klik.
Apa yang kita akan lakukan ialah kita akan membuat pautan kami lebih serupa dengan butang.
Jadi, kita akan mempunyai beberapa butang yang sama dokumen dot mendapatkan unsur oleh Id.
Dan jika saya bercakap tentang klik pautan atau klik di sini untuk berparti
pautan, apa yang mungkin Id saya berada di sini?
Parti.
Betul.
OK tidak terlalu buruk setakat ini.
Setiap orang mendapatkan apa yang kita lakukan?
>> OK, jadi sekarang kita mempunyai kita butang, dan kita mahu
perkara berubah apabila kita klik di atasnya.
Jadi, jika kita ingat dari PowerPoint kami, perkara yang sangat mudah yang boleh kita lakukan
hanya butang dot onclick, bukan?
Dan itu akan sama dengan beberapa fungsi.
Ini adalah satu fungsi tanpa nama.
Dan ini hanya as-- sebenarnya saya akan membuat ini lebih besar sedikit.
>> Jadi apa yang saya hanya lakukan di sini saya katakan, OK,
apabila kita klik butang kami, yang pautan ini bahawa kita hanya disebut,
kita akan melaksanakan fungsi tanpa nama ini.
Kita tidak memerlukan sebarang input.
Kami tidak peduli apa kata pengguna.
Apabila mereka klik padanya, kami akan lakukan apa saja yang kita mahu,
yang menukar warna latar belakang.
OK?
Jadi itulah sebabnya kita tidak mempunyai apa-apa input, kita hanya mempunyai fungsi tanpa nama ini.
Dan kini kita sebenarnya akan untuk menulis fungsi ini.
>> Jadi ada banyak cara anda boleh menjana warna rawak.
Cara yang saya lakukan itu adalah untuk menjana tiga nombor rawak
dan menukar mereka kepada RGB tiga lapis.
Jadi ini hanya menunjukkan anda beberapa sejuk perkara-perkara yang jika anda seperti, "oh,
Saya perlu menjana rawak nombor. "jika anda Googled ia,
ini adalah apa yang anda akan dapati.
>> Oleh itu, kita mempunyai tiga berbeza perkara, var, tidak lagi merah, hijau.
Betul?
Jadi mereka adalah tiga perkara yang membentuk warna.
Biru, merah, dan hijau.
Cool.
Dan apa yang boleh kita lakukan ialah kita tahu bahawa ia perlu menjadi antara 255,
dan jika kamu melihat ke atas beberapa penjana nombor rawak,
anda boleh mendapatkan sesuatu seperti matematik dot rawak, yang jika anda melihat ini sehingga
kembali ke beberapa nombor antara sifar dan satu.
OK?
Dan apa yang kita lakukan nombor Tiga kali ganda antara RGB pergi?
Sifar dan apa?
Apa yang mereka boleh naik ke?
255.
Jadi jika matematik dot rawak pergi di antara sifar dan satu,
bagaimana mungkin kita mahu menukar ini?
PENONTON: Masa?
ALLISON BUCHHOLTZ-AU: Ya, betul-betul.
Jadi masa adalah 255.
>> PENONTON: [didengar] Ia seperti [didengar].
ALLISON BUCHHOLTZ-AU: Math dot rawak.
PENONTON: Cool.
ALLISON BUCHHOLTZ-AU: Ya.
JavaScript hanya menjaga anda.
OK.
Oleh itu, kita boleh berbuat demikian untuk semua ini.
Betul?
Math dot kali rawak 255.
Salin itu.
Cool.
Jadi perkara itu, boleh ini tidak kembali integer.
Betul?
Mungkin kita mendapatkan jumlah antara sifar dan satu,
dan ia menyebabkan ia menjadi sedikit off, dan RGBs kami tidak boleh terapung.
Mereka perlu ints.
Jadi, jika anda cuba ini, ia akan mungkin mempunyai beberapa tingkah laku tidak menentu.
Ia akan menjadi sedikit funky.
Jadi apa yang kita lakukan ialah kita ingin memastikan bahawa ini adalah bulat,
dan anda boleh pusingan cara sama ada.
Saya bulat dengan lantai.
Oleh itu, saya sentiasa memastikan bahawa ia diturunkan.
Tetapi akan kira bagaimana mudah ia adalah untuk hanya mendapatkan nombor rawak,
bagaimana anda rasa kami mungkin lantai nombor ini?
Ia hampir sama.
Apa-apa idea?
Jadi jika rawak hanya matematik dot rawak, jadi jangan anda fikir kita akan lakukan lantai?
Math dot lantai.
Dan anda juga boleh melakukan matematik dot siling.
Pusingan adalah sejenis kabur kerana anda tidak melakukan
tahu sama ada untuk menggaruk atau pusingan ke bawah.
Jadi biasanya kita selalu melakukan matematik lantai dot, dot siling matematik.
Tetapi honestly--
>> PENONTON: Adakah pusingan tingkat ke bawah?
>> ALLISON BUCHHOLTZ-AU: Tingkat pusingan ke bawah.
Dan itu hanya pilihan di pihak saya.
>> Jadi sekarang kita mempunyai tiga nombor kami yang telah dijana secara rawak,
dan apa yang kita akan lakukan sekarang ialah kami hanya akan menukar latar belakang.
OK?
Jadi kita sudah ada kami latar belakang jenis disimpan
dalam elemen ini dikenali sebagai latar belakang.
Jadi apa yang anda akan perasan adalah, jika anda bermain-main dengan ini,
kita ingin menukar gaya.
Dan ini adalah sejenis sesuatu yang anda akan Google dan memikirkan,
suka bagaimana untuk menukar warna.
>> Tetapi cara anda mengakses warna ini adalah latar belakang latar belakang gaya dot dot.
Jadi ini adalah pepatah diberikan objek ini, latar belakang,
yang merujuk kepada yang unsur Id di sana,
kita akan melihat gaya dalam gaya,
kita akan melihat latar belakang.
OK?
Dan jika anda pergi dan melihat ini berangkat, ia mungkin masuk akal sedikit,
tetapi ini adalah pada dasarnya hanya berkata, "Memberikan saya sifat yang sangat khusus ini
daripada apa yang saya telah ditakrifkan sebelum ini. "
Jadi apa yang kita berubah kepada adalah beberapa RGB, kerana ia masuk akal.
Kami menggunakan RGB tiga kali ganda, bukan?
Dan kita have-- saya ingin memastikan saya mendapatkan nombor yang betul petikan di sini.
Jadi apa yang kita lakukan ialah kita mempunyai RGB, dan kita akan
supaya- ini adalah seperti dinamika yang berwarna merah.
Dan kemudian kita mahu beberapa koma.
Dan kemudian kita mahu campur hijau, maka beberapa koma, dan beberapa biru.
>> Jadi plus ini hanya bermakna seperti dinamika.
Jadi ini adalah hanya mewujudkan ini rentetan perkara yang berlaku dalam RGB.
OK?
>> PENONTON: [didengar] ditambah kemudian ditambah dengan yang hijau kemudian merah.
>> ALLISON BUCHHOLTZ-AU: Yeah, kerana saya yang merosakkan sehingga.
Denda yang satu ini.
Oh, berpegang.
No.
Kerana saya perlu memastikan bahawa saya mendapat semua hak ini.
Jadi saya akan terangkan dalam momento uno.
Hijau, biru, sempurna.
Sekarang aku selesai.
Saya percaya.
>> OK.
Jadi apa ini, adalah latar belakang yang akan ditetapkan untuk beberapa rentetan.
Betul?
Yang adalah apa yang kita ada di sini.
Ia akan menjadi sebahagian RGB 255 koma 255 koma sifar, atau apa sahaja jumlah anda
telah ada.
Oleh itu, kita lakukan di sini, kami mempunyai beberapa rentetan.
Dan apa yang kita mahu lakukan, adalah kami jenis dinamik mewujudkan
bahawa apabila kita benar-benar menjalankan program ini.
Jadi ini adalah beberapa rentetan.
Plus concatenates dengan nilai merah yang mempunyai,
yang concatenates ia dengan koma, yang concatenates ia
dengan apa yang hijau, dan sebagainya, dan sebagainya.
OK?
Sehingga akhir sangat, yang merupakan menutup kurungan RGB ini di sini.
OK?
>> Jadi apa ini akan menjana adalah beberapa program benar-benar
iaitu RGB tiga nombor latar belakang yang kini bersedia untuk.
OK?
Jadi mari kita lihat jika ia berfungsi.
Saya berharap ia, kerana jika ia tidak, saya akan menjadi sedih sebenar.
Oh tidak.
OK, berpegang.
Sudah pasti latar belakang dot dot gaya latar belakang.
Saya pasti hilang sesuatu yang hanya kecil.
Jangan kamu benci itu?
Apabila ia hanya satu kesilapan kecil sedikit?
Latar belakang Maha Kuasa.
RGB.
>> PENONTON: [didengar]
ALLISON BUCHHOLTZ-AU: No.
Saya cuba ini sebelum kelas.
Saya mempunyai semua yang saya lakukan sebelum kelas dalam kes saya adalah seperti,
"Menunggu, apakah yang saya lakukan salah?"
Kerana saya adalah seperti, "Saya akan mungkin keadaan kucar-kacir ini sehingga pada satu ketika. "
Plus hijau.
Semuanya kelihatan seperti itu berkaskad betul.
OK.
>> PENONTON: [didengar]
>> ALLISON BUCHHOLTZ-AU: Oh, di sana anda pergi.
Itulah apa yang saya perlu.
Melihat bahawa.
Tiffany untuk menyelamatkan.
Perfect.
OK.
Sekarang mari kita lihat jika ia berfungsi.
Oh Tuhanku.
OK.
Berpegang.
>> PENONTON: Space selepas campur kedua.
>> ALLISON BUCHHOLTZ-AU: Yang mana satu?
Oh tunggu, berpegang.
Ruang haus?
>> PENONTON: Kedua ditambah dalam dinamika yang hijau.
ALLISON BUCHHOLTZ-AU: Oh.
PENONTON: Tidak ada ruang selepas campur, yeah.
ALLISON BUCHHOLTZ-AU: Anda tidak perlu itu, but--
PENONTON: Oh, anda tidak?
ALLISON BUCHHOLTZ-AU: Ia kelihatan cantik.
PENONTON: OK.
OK.
>> ALLISON BUCHHOLTZ AU: Mari kita lihat jika ia berfungsi.
OK.
Saya jelas gagal di demo ini, yang mengingatkan saya
syarahan minggu yang lain, tetapi saya tahu ini akan berfungsi.
Saya tahu ini akan berfungsi.
Begitu dekat.
Sebelum aku sengaja dipadam skrip saya yang satu ini.
Tidak, ia adalah titik pihak js.
OK berpegang.
Saya akan menyalin ini, dan saya juga hanya akan memadam segala-galanya,
kerana saya mempunyai kerja ini lebih awal.
>> Saya berjanji ia berfungsi.
Jika tidak, saya akan menunjukkan kepada anda apa yang Tommy adalah.
Dan di sana.
>> PENONTON: Anda rujukan pihak dot CSS, dan ia adalah satu js pihak titik.
>> ALLISON BUCHHOLTZ-AU: Ah, baik di sini adalah js dot pihak.
OK, apa yang saya lakukan yang berbeza?
OK, kita akan melihat jika ini kerja-kerja kini.
Bam.
Jadi, saya tidak tahu apa yang saya lakukan secara berbeza, tetapi ini adalah apa yang sepatutnya berlaku.
Kinda sejuk.
Saya klik pada ini, seperti, selama-lamanya.
Tetapi kita boleh cuba melihat apa yang saya lakukan berbeza yang satu ini mempunyai.
Saya tidak tahu tentang anda semua, tetapi ini kelihatan pada dasarnya apa yang saya hanya menulis.
Mungkin ada yang hilang koma bernoktah di suatu tempat adalah perkara yang saya.
Sebenarnya selepas, saya rasa saya telah hilang koma bernoktah di sini sebenarnya.
Tetapi saya tidak dapat melihatnya kerana ia adalah dari skrin.
>> Tetapi jika kita lihat, ini adalah cukup banyak betul-betul apa yang saya hanya menulis.
Saya rasa mungkin bahagian yang paling sukar tentang ini adalah jenis hanya perkara ini betul
di sini, pemahaman apa yang ia lakukan di sana.
Ini macam perkara yang anda belajar benar-benar hanya dengan Googling dan jujur
hanya cuba.
Jika anda fikir ada beberapa sifat, mungkin ada.
Oleh itu, cuba ia.
Lihat apa yang berlaku.
Seperti yang saya katakan, ada banyak uji kaji dengan JavaScript,
dan PHP, dan apa yang barangan, dan CSS terutamanya.
Itulah satu-satunya benar cara untuk memahaminya.
>> OK, jadi selepas itu kemelut dengan pihak js dot, kita mempunyai dua pilihan lain.
Kami ada jam atau Twitter.
Mereka berdua menarik.
Mungkin tidak cukup sebagai menyeronokkan sebagai pihak, yang mempunyai menyala sedikit sejuk
perkara pada akhirnya.
Adakah anda mempunyai sebarang keutamaan?
PENONTON: Jam?
ALLISON BUCHHOLTZ-AU: Jam?
OK.
Cool.
>> Jadi sekali lagi, kita mempunyai kita fail JavaScript kosong.
Dan seperti yang kita lihat di sini, kita mempunyai beberapa HTML sangat mudah.
Kami mempunyai lembaran gaya kami, yang hanya format apa yang ia akan kelihatan seperti.
Kami mempunyai div kami dengan satu Id jam, yang
hanya berkata, "ini harus menjadi jam."
Dan kami mempunyai pautan kami ke fail JavaScript kami
yang yang sebenarnya akan menjana jam kami untuk kami.
Kerana perkara yang sejuk, adalah bahawa anda boleh ditetapkan JavaScript untuk memuat semula secara automatik
sendiri.
OK?
Jadi, daripada menunggu pengguna untuk memukul Refresh pada muka surat yang
supaya anda boleh mendapatkan masa dikemaskini, JavaScript
boleh mengemas kini ia bagaimanapun ia suka.
>> Jadi, seperti yang terkini dengan kami, kami mahu untuk mengakses latar belakang kita, bukan?
Jadi, apa yang anda fikir boleh menjadi Perkara pertama yang kita mahu lakukan di sini?
Jika kita seperti hendak pergi luar seperti ini paradigma di sini?
Kami mungkin mahu mengakses jam kami, bukan?
Jadi, kita mempunyai beberapa var jam, yang equals--
apa yang kita fikir ia akan menjadi?
Dokumen dot mendapatkan unsur oleh- saya juga suka Id Sublime-- dan Id kami adalah jam.
Koma bertitik.
Got memastikan untuk mendapatkan orang koma bertitik masa ini,
kerana saya rasa seperti yang adalah masalah masa lalu.
OK begitu, kerana saya hanya mengatakan dengan cuba mempunyai JavaScript menyegarkan dirinya,
ada fungsi yang hebat ini, saya tahu ia datang dalam berguna pada tahun lepas,
Saya tidak pasti ia akan menolong untuk ini Serangga, tetapi ia dipanggil selang set.
Dan ini adalah benar-benar benar-benar sejuk jika kamu berbuat apa-apa
dengan masa atau mendapatkan maklumat yang terkini.
Di dalam laman web untuk sebuah akhir projek, ini mungkin
fungsi anda mahu mendapatkan super tahu.
Jadi apa yang menetapkan jarak tidak adalah bahawa kita akan memberikan fungsi,
dan berapa kerap ia perlu memanggil fungsi ini.
OK?
>> Jadi dalam kes ini, kita hanya akan mewujudkan beberapa fungsi tanpa nama lagi,
OK, yang akan mendapatkan tarikh kami, dan masa kita,
dan kemudian mengemas kini perkara dan memaparkannya.
Oleh itu, kita akan bimbang tentang itu.
Kami akan menjadi seperti menjana jam di sini.
Tetapi apa yang kita perlukan ialah bagaimana sering untuk menyegarkan ia.
Jadi dalam kes ini, ia hanya milisaat.
Oleh itu, kita hanya akan melakukan 100 milisaat.
Sudah tentu, benar-benar sewenang-wenangnya.
Jika anda mahu ia untuk mengemas kini lebih perlahan, anda boleh.
Kami boleh menggagalkan sekitar dengan tempoh yang ditetapkan,
berapa besar selang kami adalah selepas kita mendapatkan jam bekerja, yang mudah-mudahan saya akan
dapat.
Jadi ini adalah hanya berkata, "OK, panggilan fungsi ini setiap 100 milisaat. "
OK?
Itu sahaja ia.
>> Jadi apa yang kita mahu fungsi kami untuk lakukan ialah kita mahu mempunyai beberapa tarikh
dan masa adalah apa yang kita akan mempunyai.
Jadi Kita boleh mulakan dengan kami tarikh sama dengan sesuatu,
dan masa kita sama sesuatu bahawa kita tidak tahu lagi.
Atau sebenarnya, kita hanya perlu tarikh, kerana tarikh akan merangkumi segala-galanya.
Sekali lagi jika anda hanya apa-apa mengenai Google apa yang anda mahu lakukan, jika anda menulis, "OK,
Saya ingin mendapatkan masa yang menerusi JavaScript, "ia
akan memberikan anda yang hebat ini fungsi dipanggil tarikh get.
Secara literal, kebanyakan perkara yang anda mahu lakukan,
JavaScript akan mempunyai ia dilakukan untuk anda sudah.
Jadi ia adalah benar-benar seperti baru mendapatkan tarikh, yang creating--
atau tarikh baru, rather-- yang menjana
beberapa objek yang mewakili tarikh.
>> Dan apa yang kita akan lakukan di sini adalah is-- ini saya akan menulis ini,
dan kemudian menjelaskan apa yang ia lakukan.
Jadi saya akan pastikan saya mendapat hak ini.
>> OK, jadi apa fungsi ini tidak, adalah kita Hanya
mewujudkan HTML yang sebenarnya akan pergi dalam Id div kami jam.
Jadi apa ini akan melakukan hanya menjana beberapa rentetan, OK?
Yang kemudian akan menjadi dipindahkan ke dalam HTML kami.
Pada asasnya apa yang ia akan lakukan adalah apa we-- apa yang saya akan menunjukkan kepada anda
ialah apa yang kita katakan adalah HTML, kita akan menggantikan teks ini di sini
dengan apa HTML adalah.
Jadi ini akan membolehkan kita untuk menukar paparan jam dot kami
HTML daripada hanya teks ini harus jam, untuk benar-benar menunjukkan
nombor dan perkara-perkara yang kita mengambil berat kira-kira, dan benar-benar menjadi jam.
>> Jadi apa yang kita akan lakukan ialah kami akan mula menjana HTML ini.
Jadi dengan cara yang sama bahawa kita digunakan untuk melakukan campur sama untuk integer,
kini anda boleh melakukannya untuk tali, kecuali ia akan menyatukan mereka.
Betul?
Seperti yang kita lihat dengan dot pihak js, ini hanya concatenates semua ini bersama-sama.
Jadi, anda boleh menyatukan bit yang berbeza HTML daripada pembolehubah, atau cebisan tali
bahawa anda menulis diri sendiri, dan ini hanya
benar-benar membolehkan anda untuk secara dinamik menjana HTML, yang cukup sejuk.
Jadi, jika anda mempunyai sesuatu sangat user tertentu,
ini boleh membolehkan anda untuk berbuat demikian.
>> Oleh itu, kita mempunyai HTML, untuk saya akan cuba memastikan saya mendapat hak ini.
Jadi, kita akan melakukan beberapa header h1.
Jadi apa yang penting untuk menyedari di sini adalah bahawa ini adalah benar-benar hanya HTML.
Betul?
Kami menulis sebenar Kod HTML di sini, ia
bukan hanya satu rentetan dalam biasa cara yang kita akan berfikir mengenainya.
Oleh itu, kita mempunyai beberapa HTML.
Ini dianggap tali di sini walaupun.
Dan kita lakukan tarikh dot-- kita ingin mendapatkan jam kami.
Sekali lagi, jika anda adalah untuk melihat sehingga apa-apa mengenai tarikh,
ia akan memberitahu anda semua ini adalah sifat-sifat yang mempunyai tarikh.
Dan di sini adalah apa yang anda boleh gunakan di atasnya.
Oleh itu ia mungkin mempunyai sesuatu seperti mendapatkan jam, dan mendapatkan minit,
dan mendapatkan saat, dan mendapatkan milisaat, dan siapa tahu apa lagi yang mereka ada.
Tetapi jika anda melihat ke dalam dokumentasi, ia semua akan berada di sana.
>> Oleh itu, kita perlu mendapatkan jam, dan kemudian kita mahu
untuk menyatukan bahawa with-- Saya akan bergerak ini di sini.
Jadi, jika kita menjana sekarang, kami sebenarnya menjana masa, bukan?
Kami mempunyai jam, dan kemudian apa yang antara jam dan minit?
Anda mempunyai koma bertitik, betul?
Oleh itu, kita mahu melakukan koma bernoktah di sini.
Dan kemudian kita mahu mendapatkan kami minit, jadi dengan cara yang sama
bahawa kita mempunyai tarikh dot mendapatkan jam, bagaimana mungkin kita akan mendapat minit kami?
Ia benar-benar tarikh dot mendapatkan minit, yang saya jenis suka.
Ia seperti, "oh, bagaimana saya mendapatkan minit saya? "
Saya hanya mendapatkan minit saya.
>> OK.
Dan kemudian kita mempunyai usus besar lain di sini.
Dan kemudian jika kita ingin mendapatkan kami saat, bagaimana kita boleh mendapatkan kedua kami?
Tarikh dot mendapatkan saat.
Saya rasa ia agak sejuk.
Dan apa yang penting kepada sedar, adalah bahawa kita juga
perlu menutup tag HTML kami di sini, kerana ia masih harus HTML sah, jadi h1.
Cool.
>> Jadi selepas itu, yang boleh kita lakukan jam dot HTML dalaman adalah sama dengan HTML.
OK?
Jadi ingat bagaimana saya berkata HTML dalaman pada dasarnya
mengambil apa yang di antara itu dua tag yang kita bercakap tentang
dan memasukkan atau memanipulasi apa yang ada di sana?
Jadi apa ini berlaku, jika kita kembali kepada jam kami,
adalah bahawa jam merujuk kepada segala-galanya dalam div ini.
Ini adalah HTML dalaman ini div jam Id.
Dan maka ia akan berubah kepada HTML yang kita hanya dihasilkan,
yang, yang, diharapkan, mudah-mudahan, mudah-mudahan,
akan menunjukkan masa sekarang.
Kami akan melihat.
Sudah tentu.
Begitu banyak isu-isu teknikal.
Just-- Allison ini saya off permainan hari ini lelaki saya.
OK, yang bekerja.
jam dot HTML dalam.
Ia adalah HTML Really?
Juga ini adalah apa yang berlaku.
Apabila anda tidak dapat melihat sesuatu, anda hanya melihat kod sumber anda.
OK.
Adakah anda mahu tahu kerja yang sejuk sekitar yang kita akan lakukan di sini?
>> PENONTON: Boleh dibuat huruf besar?
Huruf besar?
Kerana anda telah mendapatkan jam, dan kemudian mendapatkan minit.
>> ALLISON BUCHHOLTZ-AU: Ia adalah mendapatkan jam dan get-- oh.
Anda are-- bintang emas.
Itu semua ujian, guys.
Saya berjanji ia bekerja sebelum kelas.
>> OK, tetapi sesuatu yang sejuk untuk tahu adalah bahawa anda boleh also-- jika kadang-kadang
fail luaran anda adalah mendapat sedikit gila,
anda juga boleh hanya meletakkan mereka lurus di sini, yang cenderung untuk menetapkan sesuatu.
Kecuali ini adalah seperti benar-benar hodoh.
Sudah tentu memformat segala-galanya.
Pastikan itu semua cukup.
OK.
>> Saya mahu melakukan semua demo sejuk, dan mereka hanya tidak bekerja keluar.
OK.
Skrip jam var.
Anyways, apa yang penting adalah bahawa ini adalah cara yang umum
bahawa anda akan memformat JavaScript.
Seperti yang anda lihat, ia boleh menjadi sangat cerewet kadang-kadang,
walaupun ia adalah benar-benar kerja dua saat yang lalu.
Atau tidak dua hari lalu, tetapi sangat, baru-baru ini.
>> Jadi untuk menunjukkan apa yang ia akan kelihatan seperti, dan untuk menunjukkan kepada anda bahawa saya tidak gila,
dan segala sesuatu yang betul-betul sama, ini adalah apa yang ia akan kelihatan seperti.
Anda hanya akan melakukan bahagian atas ini di sini, dan jika anda melihat sumber halaman,
jika anda perasan, dia telah mendapatkan perkara gila, saya dipermudahkan ia.
Juga, kredit kepada Tommy McWilliam, yang sebenarnya
membantu saya membuat contoh-contoh ini, itulah sebabnya saya tahu mereka bekerja.
Kerana Tommy adalah pakar JavaScript.
Tetapi jika kita lihat, kita mempunyai beberapa set.
Kami mempunyai fungsi jam kami di sini.
Ini semua JavaScript yang kita hanya menulis, atau sebahagian daripadanya.
Kami hanya menulis satu ini di sini.
Dan dia mempunyai tambahan fungsi yang hanya pad ia
dengan meletakkan sifar ke hadapan surat atau sebelum beberapa jika ia
hanya salah seorang daripada mereka.
Jadi, jika anda perhatikan, ini adalah cukup lebih tepat apa yang kita hanya menulis.
Anda mempunyai beberapa jam yang berubah-ubah ini berunsur kami, dapatkan unsur oleh ID,
iaitu jam.
Kami mempunyai set selang kami fungsi, itu
fungsi tanpa nama yang melaksanakan semua ini.
Kami telah memulakan beberapa rentetan HTML yang kita maka secara dinamik
menghasilkan sesuatu yang memberikan header h1, concatenating
dengan mendapatkan jam, ditambah kolon kita, ditambah mendapatkan
minit, ditambah lagi kolon, ditambah saat kami,
dan akhirnya HTML berakhir untuk itu.
Dan kemudian kita mengemaskini jam kami dot HTML dalam ke HTML,
dan kami mengemas kini setiap 100 milisaat.
OK?
>> Lihat Saya berjanji saya tidak gila.
Saya tidak tahu.
Saya tidak tahu mengapa ia tidak seperti saya.
Saya rasa seperti kelihatan yang sama, tetapi nampaknya ia membenci saya.
>> Jadi mari kita lihat jika pusingan tiga pergi lebih baik.
Kami kira-kira untuk melihat.
Saya tidak pasti bagaimana ini akan pergi.
Apakah semua orang sekurang-kurangnya mendapat keburukan, seperti hanya tema umum
JavaScript, walaupun?
Saya berharap itu sekurang-kurangnya berguna, lebih daripada menunjukkan bahawa itu sedikit cerewet.
Tetapi set masalah anda akan menjadi sangat menyeronokkan.
Ia akan menjadi besar.
Ia tidak akan menjadi cukup sebagai membosankan kerana ini, saya tidak fikir.
Anda benar-benar akan mendapatkan untuk melihat perkara-perkara benar-benar sejuk.
>> Jadi lepas tetapi tidak kurangnya, kami akan cuba salah Twitter.
Saya benar-benar takut sekarang, guys.
Saya tidak tahu bagaimana ini akan pergi.
Tetapi hanya untuk memberikan anda sedikit rasa lebih, dan ini adalah sebenarnya
tali memanipulasi dan input, apa yang kita akan lakukan
adalah, jika kita lihat di sini dengan HTML-- yang satu ini mempunyai sedikit more--
kami mempunyai beberapa kawasan teks, yang sepadan dengan kawasan teks ini di sini.
OK?
Dan yang mempunyai Id teks.
Kami restyled ia sedikit dengan beberapa lebar dan tinggi
bahawa kita telah ditentukan terlebih dahulu, dan kami telah H1,
yang hanya merupakan salah satu header kami bahawa mewakili aksara yang tinggal kami.
Kami memberikannya beberapa Id aksara yang tinggal,
dan maka kita mempunyai beberapa skrip di sini, yang saya benar-benar
berharap masa ketiga daya tarikan di sini, guys.
>> Jadi apa yang kita mahu lakukan, dalam urat umum yang sama
yang telah kami lakukan dengan js jam dot dan pihak js dot seperti yang kita dapati,
sedang kami telah bermula dengan sebenarnya meraih perkara-perkara yang kita mengambil berat tentang, bukan?
Jadi dalam kes ini, terdapat dua perkara yang kita mengambil berat tentang, OK?
Satu perkara yang kita benar-benar jenis mengkaji dan merangka data dari,
dan satu perkara yang kita sebenarnya sedang berubah.
Jadi ada HTML kami.
Jika ini adalah laman web kami di sini, apa yang data yang kita lihat?
Ia akan menjadi apa sahaja teks dalam peti kami, bukan?
Jadi apa yang saya menaip di sini.
Itulah yang saya ingin tahu, atau itulah yang saya mahu melihat.
Dan apa yang akan menjadi berubah pada laman web kami?
Aksara yang tinggal.
Jadi dengan cara yang sama, kita mahu mulakan dengan Memulakan pembolehubah
yang benar-benar memegang unsur-unsur.
OK?
Jadi, jika kita mempunyai beberapa var iaitu kawasan teks kami,
dan kami mempunyai beberapa var yang selebihnya.
Betul?
Jadi ini akan memegang kedua-dua perkara.
Jadi perkara yang sama perkara, dokumen dot-- OK, saya
akan memastikan ini adalah pergi ke tempat kerja masa ini.
Saya amat berkeras.
OK, jadi jika kita mahu kami kawasan teks, mengikut
untuk HTML kami, apa yang pengecam kami?
Apa Id kami?
Ia hanya akan menjadi teks kerana ini mewujudkan kawasan teks kami, OK,
Id dan kami adalah teks, jadi itulah bagaimana kita boleh merebut apa yang ada di sana.
OK, koma bertitik.
Saya akan menjadi super tepat tentang perkara ini,
kerana saya mahu ini untuk berjaya pada masa ini.
OK, melakukan perkara yang sama, mendapatkan unsur oleh Id.
Saya benar-benar tertanya-tanya apa yang telah disebabkan dua yang lain untuk merosakkan.
OK, kemudian dalam satu ini, apa yang kita mahu untuk mengakses?
Apa Id kami di sini?
Kami mempunyai Id lain dalam HTML kami, apakah ia?
PENONTON: Baki aksara.
ALLISON BUCHHOLTZ-AU: Baki aksara.
>> OK.
Cool.
Jadi, saya hanya akan menulis ini benar-benar cepat.
Saya hanya akan menulis ini dalam kedua.
Jadi kawasan teks.
Apa yang menarik ialah B function-- terdapat banyak fungsi yang bukan sahaja
sesuai dengan anda tetikus, tetapi papan kekunci anda.
OK?
Jadi, anda boleh mengatakan apabila sebarang kekunci adalah ditekan, anda boleh melakukan perkara-perkara seperti itu.
Jadi salah satu yang kita gunakan dipanggil pada kekunci up, yang
berkata, "jika anda telah ditekan sebarang kekunci pada papan kekunci anda, apabila pengguna telah ditarik balik
jari mereka off butang yang, dan kunci telah menjadi unpressed,
maka kita akan melakukan sesuatu. "
OK?
Jadi ini masuk akal, bukan?
Kerana setiap watak kita menaip, kita akan
untuk mempunyai untuk mengangkat jari kita off daripadanya, jadi apabila kunci naik,
kita boleh tahu untuk penyusutan watak kita tinggal.
>> Oleh itu, kita mempunyai beberapa pada kekunci up, dan dengan cara yang sama,
kita akan berkata, "OK, apabila kita berbuat demikian, kita
akan mewujudkan beberapa fungsi yang akan mengambil e, "dalam kes ini,
dan apa yang kita mahu lakukan adalah mengira jumlah baki.
OK, jadi mari kita mulakan dengan mewujudkan pemboleh ubah.
Oleh itu, kita mempunyai beberapa r berubah-ubah, yang akan membawa satu
bilangan aksara yang kita tidak buat.
OK?
Kita tahu bahawa kita bermula dengan 140, dan jika kita ingin tahu,
katakan, panjang ini tali yang Sudah input,
adakah anda mempunyai sebarang idea bagaimana kita boleh berbuat demikian?
Hanya didasarkan dari yang jelas perkara, seperti jika kita mahu jam,
kami pernah mendapatkan jam.
Kita tahu bahawa objek kita adalah kawasan teks, tetapi boleh anda semua
memikirkan apa yang mungkin datang selepas itu?
Apa-apa idea?
>> Jadi seperti ini seseorang kurang intuitif, tetapi ia nilai panjang titik.
Jadi hanya memberikan saya beberapa atribut nilai yang
sebenarnya panjang tali ini.
Jadi ia akan berkata, "OK, saya sedang mencari di keseluruhan rentetan ini dalam kawasan teks,
dan saya akan memberitahu anda berapa lama ia. "
Kerana jika kita ingat tali adalah benar-benar hanya tatasusunan,
jadi kita boleh mengambil panjang mereka.
Oleh itu, kita mempunyai yang.
Cool.
>> Maka apa yang kita mahu lakukan adalah kita tidak mahu membenarkan pengguna
untuk input lebih daripada 140 aksara, bukan?
Kerana jika kita katakan seperti, "oh, anda hanya mempunyai baki sebanyak ini, "
dan kemudian membiarkan mereka berbuat demikian anyways, kami telah terbaring.
Dan ini adalah satu lagi perkara yang JavaScript
boleh menjadi benar-benar baik untuk, adalah pengesahan pengguna
dan memastikan bahawa anda pengguna sesuai dalam mana-mana kaedah
yang telah anda berikan kepada mereka.
Jadi, jika anda mahu untuk melakukan perkara seperti membuat memastikan input seseorang alamat e-mel mereka,
atau memastikan bahawa apabila mereka memasukkan dua kata laluan, mereka dipadankan.
JavaScript boleh melakukan itu.
Anda akan melakukan sesuatu seperti, "apabila borang yang dikemukakan, "atau seperti,
"Apabila butang Hantar Borang adalah klik, daftar semua perkara ini. "
Dan yang boleh kita lakukan yang JavaScript.
Jadi itulah apa kita akan lakukan di sini.
>> Jadi apa yang mungkin menjadi satu cara untuk memeriksa jika mereka telah pergi lebih 140 aksara?
Apa yang akan berlaku kepada nilai kami r jika mereka cuba?
Ia akan menjadi negatif, bukan?
Atau ia akan menjadi kurang daripada atau sama dengan sifar.
Oleh itu, kita boleh menggunakan jika itu adalah hanya suka segala sesuatu yang lain.
OK?
Dan kami mempunyai beberapa kawasan teks dot nilai, dan apa yang kami lakukan di sini
adalah kami hanya cutting-- apakah ia?
Maaf.
Yang ini, kami hanya mahu kembali palsu.
I tidak perlu lagi keliru.
Semua frazzled dari perkara yang tidak bekerja.
OK, kita hanya mahu kembali palsu, dan kemudian kita
ingin memaparkan baki aksara, bukan?
Jadi dengan masa, kita lakukan sesuatu dengan HTML dalaman, bukan?
Jika kita menetapkan ia sama dengan beberapa berubah-ubah, jadi apa yang kita boleh lakukan di sini?
Apa yang kita berubah HTML dalaman?
>> PENONTON: Baki?
>> ALLISON BUCHHOLTZ-AU: Kami mengubah baki.
Baiklah, dan apa yang kita lakukan mahu untuk menetapkan ia sama dengan?
Ia akan menjadi r, kerana yang harus watak kita tinggal.
OK?
Jadi saya benar-benar saraf untuk melihat jika ini kerja-kerja sekarang, tetapi kita akan melihat.
Tinggalkan ini.
Itu benar-benar cepat.
[Didengar] OK.
Sekali lagi, saya hanya akan menunjukkan kepada anda.
Untuk apa-apa sebab, saya membuat keputusan untuk tidak bekerja,
tetapi apa yang saya akan menunjukkan kepada anda adalah bahawa ini is-- oh saya sepatutnya meletakkan bahawa dalam.
OK, kita lihat beberapa perkara yang sama perkara di sini, mendapatkan kawasan teks.
>> Juga, jika anda lelaki notis, jika ada pernah sesuatu yang anda mahu lakukan,
dan anda tidak tahu bagaimana untuk melakukannya ia, hanya klik View Page Source,
dan mereka akan memberitahu anda.
Kadang-kadang ia akan disulitkan.
Untuk Serangga anda, kami menyulitkan segala-galanya, jadi ia hanya kelihatan seperti bahasa raban.
Tetapi jika ada yang benar-benar pernah laman web yang sejuk yang anda suka,
jika anda hanya klik View Page Source, ia akan memberitahu anda bagaimana untuk melakukannya.
Jadi sekali lagi, kerja lebih bijak, bukan lebih keras.
Dan seperti yang anda lihat di sini, semua perkara-perkara ini adalah sama.
satu ini di sini hanya mengambil masa beberapa subrentetan itu, saya lupa apa yang ini tidak.
Tetapi ia jelas mengambil beberapa subrentetan daripada nilai dari sifar hingga sepuluh,
dan pulangan palsu apa perlu berhenti pengguna dari memasukkan lagi,
dan kemudian jelas mengemas kini HTML dalaman di sana.
>> Cool.
Mengambil aways begitu besar dari hari ini, eksperimen, melihat kod sumber
kerana ia akan banyak membantu anda, dan semua orang, kadang-kadang JavaScript
boleh menjadi sukar untuk bekerja dengan dan tidak sentiasa berfungsi dengan cara yang anda mengharapkan ia,
tetapi hanya terus mencuba kerana saya berjanji ia akan.
Saya berjanji semua contoh ini telah bekerja sebelum kelas.
Saya tidak faham apa yang berlaku.
Saya benar-benar mempunyai segala-galanya yang sama.
>> Satu lagi perkara yang saya ingin menunjukkan lelaki yang boleh menjadi super berguna
adalah dalam- apa yang bekerja sebelum ini?
Kami mendapat pihak kepada kerja, tidak kita?
Saya fikir begitu.
Ya.
Kami lakukan.
Awesome.
OK, jadi satu perkara yang anda semua perlu tahu
adalah log konsol yang saya bercakap tentang.
Jadi menghibur log dot daripada hello.
Jadi ini adalah jenis yang JavaScript bersamaan printf.
Jadi, jika anda pernah mahu memeriksa pembolehubah anda
atau melihat apa yang berlaku di sana, apa yang yang boleh anda lakukan adalah, jika kita memeriksa elemen,
adalah apa yang anda mahu pergi untuk, dan anda pergi untuk menghibur,
anda akan melihat bahawa ia dicetak hello.
>> Oleh itu, kita boleh memilikinya cetak apa sahaja yang kita mahu.
Jika kita mahu ia untuk mencetak latar belakang latar belakang gaya dot dot,
kita akan dapat melihat RGB tiga yang muncul.
Atau tidak.
Saya lupa bagaimana anda mencetak pembolehubah seperti itu,
tetapi anda akan dapat mencetak perkara seperti itu.
Itu akan sangat berguna untuk Serangga anda apabila
anda cuba untuk memanipulasi Koordinat atau barang kecil.
Jadi mereka juga menukar sekeping ini di dalam kelas.
Ini adalah berbeza daripada tahun lepas, jadi hanya lebih baik untuk TFS anda, atau TFS
pada waktu pejabat sebaliknya, kerana kami jenis pembelajaran bersama-sama dengan anda semua.
Tetapi log konsol adalah super, super berguna untuk JavaScript tahun lepas.
Jadi menyukainya.
Ketahui bagaimana untuk menggunakannya.
Ia lebih mudah untuk digunakan berbanding GDB, supaya hendaklah sekurang-kurangnya satu kelebihan.
Tetapi terima kasih kepada anda semua yang berfaedah dengan saya.
Saya minta maaf bahawa saya contoh untuk sebab-sebab tertentu
hanya tidak mahu bekerjasama dengan saya, tetapi saya
berharap ia membantu sejenis mendapatkan anda lebih sedikit dalam zon JavaScript.
Dan menghantar saya semua soalan anda untuk minggu depan jadi saya boleh super dibaiki,
dan saya akan membawa gula-gula dan juga tambahan gula-gula kerana ini adalah tidak masuk akal.
Tetapi kamu yang besar, dan mempunyai minggu yang menggerunkan.