[Powered by Google Translate] [週9]
[デビッド·J·マラン - ハーバード大学]
[これはCS50です。 - CS50.TV]
かしこまりました。お帰りなさい。これはCS50であり、これは9週目の始まりです。
今日、我々は、Cの文脈ではもはやデザインに特に焦点を当てる
しかし、PHPのコンテキストおよびSQLのビットとJavaScriptのビットで、
特にpsetの7の両方の端に向かって、また、あなたの最終的なプロジェクト。
実際には、あなたがあなたの最終的なプロジェクトに、その時点である場合
おそらく、少なくともいくつかの考えを与えるために開始時間かそこら前にあなたのような場所
あなたの最終的なプロジェクトに、あなたが1または2のクラスメートと協力したいのですが考えている、
あなたが言ったクラスメートとの接続問題がある場合は、
cs50.net/partners/formのフォームに記入して自由に感じる。
それはちょうど、あなたが考えているプロジェクトの種類、あなたが誰であるかを尋ね
あなたは物流上の理由からだけでどこに住んでいます。
そしてあなたは、来週かそこらそこスプレッドシートのURLの上に目を維持したい場合
あなたは、Googleドキュメントの読み取り専用バージョンを見ることができます
採用された場合は、その情報を収集している。
あなたが誰かと仕事をしたいのであれば、すべての手段で人々に手を差し伸べるして自由に感じる
そのメカニズムを介して。
しかし、人々の大半はソロで働いていますか。それは全く問題ありません。
だから、これは義務でどのような方法であることを感じることはありません。
金曜日にそれは、ちょうど私とここのチームのいくつかあった
ほとんどの部分は空の劇場。
3、観光客はそこに座っていた、それは少し厄介だったので。
我々が話をすると、データベースであった、そして我々は、pset 7について少し話をしました。
そして、あなたはちょうどまだビデオでそれをキャッチするために実現しなかった場合、それは大丈夫です。
私は当たり前の我々がそうでなければかかるだろうと、任意の用語を定義しようとするでしょう
金曜日の講義に基づいています。
>> しかし、今日、我々はポイントにあなたを取得しようとするつもりだ
ちょうどPSET 7のような何かを行うことができないという
しかし実際には、フードの下で何が起こっているか理解する
特にいくつかの我々はfunctions.phpファイル内の定位置に置くの抽象化
あなたの生活が少し楽にしますが、最終的に理解するようにする
補助輪が数週間後にオフに来たとき、あなたはまだ生き残ることができるように
現実の世界で、あなたの下に任意のCS50枠組みがなければこのようなものを行う。
精通している人のためにこの$ _SESSION、
または誰がすでに金曜日にビデオを捕まえ、SESSIONは私たちは何をすべきかを聞かせていない
PHPベースのWebアプリケーション内の？
これは、GETとPOSTの精神と類似であることを意味しますスーパーグローバル変数である
といくつかの他のですが、この事は便利何のためですか？
>> に使用されるセッションとは何ですか？うん。 [学生]がログイン中
申し訳ありませんが？ログイン中確かにログイン中[学生]。
PSET 7では、我々はログインし促進するために、このセッションスーパーグローバル変数を使用している
そして、何このスーパーグローバルの良いのは、それは連想配列であるということです。
連想配列、リコールは、単にアレイですが、インデックスがもはや数字である必要はありません
012のような。彼らは数字を使用できますか、彼らも、文字列にすることができます。
そして、あなたはまだPSET 7に飛び込んだきそうだとすれば、あなたは我々がIDと呼ばれる鍵を保管していることを思い出して
値が123のようなものですこの連想配列の内側 -
何でも現在のユーザのIDでログインです。
この動機は、ユーザがローカルホストを訪問した後でも、ということである
または私のウェブサイトは、より一般的にし、彼らがログインしました、
彼らはリンクをクリックするか、5分のための私のウェブサイトに戻っていない場合でも、
あるいはあっても、1時間または1日が、彼らは、ブラウザウィンドウを開いたまま、
このスーパーグローバル変数を介して、私は彼らがログインしていることを覚えていること
>> 言い換えれば、それは私が欲しいユーザーに関する若干長期何かを保存することができます。
そして、あなたは、ショッピングカートの化身として本当に考えることができます。
アマゾンのような場所は明らかにあなたがショッピングカートに商品を入れることができ、
しかし、HTTPプロトコルは、Webに電力を供給し、ステートレスであること
あなたがウェブサイトを訪問するという意味で、
ほとんどの部分は、いくつかのネットワークに常時接続していない
ブラウザとサーバの間。
あなたは、HTMLやJPEGやGIF、すべてのことをダウンロードした途端、
接続が消え、あなただけのサーバーからのHTMLやその他もろもろのコピーを持っている。
しかし、サーバーはあなたについての何かを覚えたいなら、
負担は実際にその情報を記録するサーバー上にあります。
そしてあなたのサーバーを管理しているプログラマ
このスーパーグローバル連想配列の内側にあなたが望むほとんど何を置くことができます
そしてそれは、そこにユーザが戻ってくる次の時間になります
、その分、あるいは数日後かどうか、彼らが彼らのブラウザウィンドウを閉じない限り、
その時点でセッションが消えます。
だから、それははかない記憶だ、それは非永続だし、それは離れて行くことを意味している
ユーザがブラウザを閉じるとすぐに - だけではなく、そのタブ、頻繁にブラウザ全体、
それによって効果的にユーザをログアウトする。
だから、このことは、実際にどのように実装されている？
のは、我々が金曜日に見て簡単な例を簡単に見てみましょう。
慣れていない人にとっては、これほど単純なものでした。
これは、その唯一の目的は生活の中で教えているWebページです
何回私はこのページを訪問した。
これは、私はそれを訪問したことを月曜日にここで初めてなので、0回言う。
>> しかし、私はこのページを再読み込みを開始した場合、それは、1時間、2、3、4、5を語る
これは最終的にはちょうど、アップ、アップ、アップ、カウントアップについていけます
たびに私は実際にそれを再読み込み]をクリックします。
だからこの仕事はどうですか？私はcounter.php呼ばれるこのファイルの中に入りましょう。
それの上部には、すべての青のコメントですが、面白い部分はここです。
13行目で、私たちは、この関数を呼び出すにsession_start、
それは文字通りあなたがアクセスできるようにしたい場合は、あなたがする必要があるすべてである
この特別なスーパーグローバル変数に$ _SESSIONを呼んだ。
つまり、すべてが可能になり、我々はそれがすべて可能なのかすぐに説明します。
16行目では、私がやっていることに気づく。
キーは、カウンターで呼ばれた場合 - つまり、インデックス値 - "カウンタ"
セッションと呼ばれるこの配列の内部に存在し、私は、下の行にそれを使って何をやっている？
18行目は何をやっている？
>> [聞き取れない生徒の応答]それは何ですか？ [学生]は、値を格納します。グッド。
それは、新しいローカルの一時変数に現在SESSIONでの値を格納している
すべて小文字でカウンタ$。
PHPはすでにここで少し怠けていることに注意してください。
我々はそのようなintやfloatまたは文字列か何かについての言及がありません注意してください
PHPは弱く型付けされているので、それによってあなたは、変数の型を指定する必要はありません
この場合には私はここにいても、まだそれを宣言していませんでした。
私は、これらの中括弧の中にそれを宣言しているとCとは違って、これは実際には大丈夫です。
深く変数の宣言をネストどんなにPHPで書かれていません -
- 内側の中括弧などの括弧の内側
それはその時点での時間で、プログラムの残りのために存在します
良くも悪くも。
だから、すぐに我々がここで行っているように、あなたがそれを定義するとすぐにグローバルになる。
>> そうでなければ、私はセッションスーパーグローバルで何かがあることを見つけていない場合、
私は明らかに、これを0に変数カウンタを初期化しています
これにより、ユーザは単に前にここに来たことがないと仮定しています。
そして、このコースはどのようにカウンタをインクリメントしていますか？
私は、この連想配列の内部の値を更新しています
現在+ 1であるものは何でもカウンターと等しい値に設定することによって。
私は、ページのHTMLにここに下にスクロールすると、それは実際に非常に簡単です。
私はこのページの本文内で持っているすべては、 "あなたは何某回このサイトを訪問しました"です。
そして、これはPHPの構築物である。
あなたが<を行う場合は？=、これはどういう機能に効果的に同等ですか？
それは、我々はC言語で何度も見てきたprintfのようなもの、と本当に同等だ
あなたはPSET 7の仕様から既に知っている可能性があるものの、
プリントもちょうど何かをプリントアウトする機能であり、それは実際には、書式コードを使用していません
そして実際にもエコーを言うことができます。
彼らはすべての正味の効果は、最終的に同じであっても、ほんの少し異なっている。
だからのこの使用は、記号はそれを行うための洗練された方法のほんの一種であるに等しい
より簡潔に比べてあなたは、そうでなければすることができるかもしれません。
そうだ、すべてこのサイトではありません。これは、カウンタの値を出力します。
これはすべて、実際にどのように起きているのか？
あなたが週を思い出すかもしれないほど前に我々はフードの下に探し始めた
Webページは、このInspectorタブを使用してどのように動作するかで。
>> ChromeはMac版、Windows版、さらにはLinuxのバージョンではこの両方を持っている
この組み込みデバッガを持ってそれによって、FirefoxとIEは似たようなメカニズムを持っています
ブラウザの内部。
のは、次を見てみましょう。
我々は、ここでのタブの全体の束を持って、一番左の1は要素であることを思い出しました
HTMLおよびJavaScriptは、ページ内にある方法godawfulに関係なく、
Elementsタブで、あなたが実際に階層的に表示されているHTMLをナビゲートすることができたことを思い出し
といい、きれい。
あなたは、GoogleやFacebookのようなサイトから学ぼうとしているのであれば
または実際に任意のウェブサイト、あなたはおそらくオフに優れていることを認識
生のソースを表示するのではなく、この方法では、ソースコードを見
これは、我々が特にGoogleのサイトで見てきたように、混乱することができます。
私の代わりに、ここで、[ネットワーク]タブをクリックしてそうだとすれば、
私はこのページを訪問したときに何が起こっているのを見てみましょう。
最初に、私のキャッシュをクリアしてみましょう。
私はChromeの設定に移動して、過去に行くつもりです
し、すべての閲覧データを消去します。
あなたは他の目的のためにこれを行うために使用される可能性があり、[笑い]
それは開発のウェブサイトに来るとき、それは実際に便利です -
あなたが笑っている場合、あなたは知っている。 [笑い]
Webサイトを開発する際に、現実があるので、それは実際には本当に便利だ
キャッシュされたHTMLファイルは、キャッシュされたJavaScriptファイルのようなクッキーや物事のようなもの
なぜなら実際に何らかの理由で、大きな頭痛の種になることができます
ブラウザを使用すると、サーバ上のそのファイルへの変更をしましたまだいくつかのファイルをキャッシュすることを決定し、
しかし、ブラウザは本当にファイルが変更されたことを実現していない
したがって、実際にはありません再ダウンロードそれはあなたが、[リロード]ボタンを選択した場合でも、
ただ障害があなたのコードを使用していないことを確認する最も確実な方法のいずれか、
それはブラウザの挙動との、あなたのブラウザーでここに行くことです
全く混乱がないように、ただ全体の履歴をクリアします。
>> あなたが本当に偏執狂的にしたい場合は、その後、ブラウザを終了し、それを再起動する
その後すべてが期待どおりに機能していることを確認します。
開発を行う際に非常に短いで、キャッシュをクリアしても良いです。
そこでここでは、[ネットワーク]タブを持っています。
私は、以前サイトを9回訪れたが、私は今では先に行くと、[再読み込み]をクリックしてみましょうしていた。
そして、私は再び0にダウンだ。
実際にそれがこのセッションスーパーグローバル変数が実装されていることである方法を見てみましょう。
私は、なされたHTTPリクエストをクリックするつもりだ
そして、このデバッグウィンドウは、私はそれの内部を見ることができます。
ここで私が興味深いものではありません、サーバーからの応答だけを参照してください。
私は、任意の数の方法でこれを見てきました。
しかし、どのような技術的に興味深いのは、ヘッダーです。
私はここにスクロールダウンして、リクエストヘッダに注力し、[ソースの表示]をクリックすると、
私は何を見に行くつもりだと、文字通りHTTP要求です
それはちょうど、私のブラウザからサーバーに行きました
手術の単語であるGETしてから、/ counter.phpファイル名であること、
HTTP/1.1は、ちょうど私のブラウザが使用しているHTTPのバージョンである。
ここでこの行は、サーバーの名前が何であるか、ブラウザからサーバーへの少し思い出させてくれます
それに話をしようとしている。
そして、この残りの部分は時々面白いけど、今は関係ありません。
>> これは単なる好奇心の一種である。
この文字列があるが不可解な、いつでもお使いのブラウザはウェブサイトを訪問
それはあなたが使用しているか、ブラウザサーバーに通知され
、あなたが使用しているバージョンをしているか、そのオペレーティングシステム。
あなたは、CNNやその他もろもろのようなウェブサイトをどのように今まで不思議に思っていましたので、もし
パーセンテージは、Web、PCユーザーでMacユーザーであるか知って、
IEユーザーは、Chromeのユーザーと同様に、それは私たちのすべてのブラウザからです
我々が何であるかそこに一つ一つのウェブサイトを指示しています。
それは必ずしも、個人を特定できる情報は含まれていません
それはあなたのIPアドレスとは何か、どのようなブラウザやOS、使用しているサーバーを教えていない。
この情報がどこにあるようだ。
しかし、何それは、これらのセッションに来るとき、今より興味深いのは、レスポンスヘッダです。
私はレスポンスに次のソースを表示]をクリックしてみましょう。
ここで何が面白いのは、いくつかのことです。
1、我々は200のステータスコードが戻ってきました。
それはすべてが順調であることを意味しますので、我々はこのステータスコードを参照してくださいことは決してない。
それは何か他のものとは対照的に、文字通り大丈夫ということです。
我々は時々悪いことがわかり数は何ですか？ [学生] 404。
404ファイルが見つかりません、403はすでににひっかかったかもしれません、
禁止されている、それはあなたがchmodする可能性が最も高いものを、忘れてしまったことを意味します。
と他人の束があります。
>> ダウンここでは、これはちょっとクレイジーです。
私は実際にはgeditのに貼り付けて数分前に、このファイルを書いた。
実際にWebがあった前になぜこのページは1981年に期限が切れた？
そこに何が起こっているのか？
>> [聞き取れない生徒の応答]タイムスタンプ。しかし、なぜですか？
それは幾分恣意的だが、それは実際に便利です。
これは何を私のブラウザに言っていることは、先ほどすでに期限切れ要求したこのPHPファイルです。
実際には、それは30年前に失効した。
しかし、それは実際に何を意味するのか？
それだけで、ユーザーがこのページを訪れた次の時間を意味する
アドレスバーにURLをリロードするか、または入力しているかどうか、
あなたが行くとそれの新しいコピーを取得することを確認してください。
これは、キャッシュの無効化の例のようなものです
単にブラウザを落胆させるために頑張るという愚かな言葉
実際にサーバから送信されたHTMLをキャッシュするから
あなたが誤ってリロードを押すと、そのファイルの同じバージョンが表示されないようにします。
あなたは実際にサーバが新しいコピーを送信する。
だから、それは1981年だという事実はまさにそのアプライアンスが選択されているものだということを意味します
過去の任意の日付など。
しかし、本当のジューシーな行はこの一つです。
でも、50前には、おそらくクッキーと漠然と精通している。
特に、あまり快適または間にそれらの間で、今のように
あなたの理解のクッキーは今何ですか
私達はあなたの理解は、より技術的なことしようとしているにもかかわらず？
クッキーとは何ですか？うん。
[学生]ユーザーに関する情報、彼らがユーザー名か何かを書いたことがあるのなら好きです。
>> グッド。それは、彼らはすでに自分のユーザー名に入力したかどうか、ユーザーに関する情報です。
クッキーとは、サーバーはユーザーについての何かを思い出すことができる方法です。
そして、何のクッキーは本当にですと、テキストフ​​ァイルまたはバイトのいくつかのシーケンスです
ブラウザの内部サーバによって植えられていること、
し、そのファイルへのまたはそれらのバイトの間で内部は、識別子のいくつかの種です。
多分それは文字通りあなたのユーザー名ですが、より頻繁に、より不可解に見える何か
bo8dal3ctなど - - これは本当に大きな英数字の文字列ここでこのような事
それは本当にちょうどあなたのためのユニークな識別子であることを意味している。
それともバーチャルハンドスタンプのようなものとして考えることができます。
あなたが実際に支払ったことを覚えておくことは、いくつかのクラブや遊園地に行く場合
とで行った、彼らはいくつかの並べ替えのあなたの手に小さな赤いステッカーを貼って、
そしてそれはあなたが既に支払われてきたカウンターで人々を連想させる
好きなように、あなたが行ったり来たりすることができます。
クッキーとは、精神のそれと少し似ています。
私はちょうど私のキャッシュをクリアした後に行ったように私は、このウェブサイトを訪問し、初めて、
Webサーバーでは、この場合のアプライアンスは、私の手に切手を貼る
PHPSESSID、セッションID、名前がある
その値は、この本当に長い英数字の文字列です。
>> だから、次回は私がリロードを打つように、私の手に今飾られのようなものだ
または手動で、ブラウザでこのURLにアクセスしてください
HTTPの定義により、私のブラウザはハンドスタンプを提示しようとしている
何度も何度も。
サーバーは、必ずしも私が誰だか知りませんので、あっても、
彼らは、少なくとも私は少なくとも、より具体的に、同じユーザまたは、同じブラウザだということを知っています。
それで、これはセッションスーパーグローバル変数がどのように実装されるか、最終的にある。
サーバーは、2番目のためのウェブサイトまたは第三者の時間を再訪したときにいてもアイデアを持っていません
あなたは、この手のスタンプを提示しない限り。
とするとすぐにその手のスタンプを提示するように、
Webサーバーは、基本的に独自の小さなデータベースに入る
とチェックが、大丈夫、私はちょうどユーザーbo8dal3ctなどのハンドスタンプを見てきました。
私はプログラマーが記憶されているどのような情報を見てみよう
このユーザーについてのスーパーグローバルの内側、
その後私は、そのデータはスーパーセッション内であることをもう一度確認しましょう
プログラマは、そのデータを再利用することができるように
それはいくつかの分または数時間前に設定されている場合でも。
しばらくの間、いわれのない非難を得たので、言い換えると、クッキー、
、ブラウザでの不安のために、彼らは本当に私たちのプライバシーとこのすべてに違反する可能性があります
彼らは実際にあるためそれらなしで偉大なユーティリティを持っている
あなたは常にあなたが訪問したすべてのFacebookのページにログインするであろう
ブラウザが覚えてのいくつかの方法を持っていなかった場合は、読み取りまたはすべてのGmailのメール
あなたは既に認証されてきた。
>> だからこの方法でクッキーがワイヤーを行き来送信されます。
クッキーについてのもう一つの好奇心が、特にここでは、これは平文で完全であるということです。
全くここで起こっている暗号化は、ありません
そして実際に私は、現時点ではHTTPを使用しています。
2年前になりましたCS50で私たちのお気に入りの瞬間の一つ、
頃Firesheepと呼ばれるツールが出てきた。
これは、セキュリティ研究者によって作られたソフトウェアの自由な作品だった
コミュニティのためのウェイクアップコールはatrociously実装だけでどのように言うことのように
Web上の特定の認証メカニズムであった。
そこで、いくつかの時間のために、Facebookは、HTTP、HTTPSではなくにわたってほぼ完全だった。
そして、あなたは暗号がどのように機能するか見当がつかない場合でも、Sは安全です
ので、それは関与し、少なくともいくつかの暗号化があることを意味します。
Facebookは、ユーザー名とパスワードを暗号化するために使用でした
しかし、すぐにあなたが見たとして、ポークまたはあなたのメッセージやニュースフィード、
そのすべてが暗号化されていました。
だから、年または2前までのGmailだった。
あなたはログインしていつでも、はい、彼らは安全な暗号化を使用し、
しかし、その後、彼らはそうしなかった。そして、なぜそうなのでしょうか？
理由だけではなく、すべての時間は、このようなユースケースで暗号化を使用しませんか？
それは何？私は何かを聞いたと思う。 [学生]スピード。
スピード、右か？これを回避する方法があります。
しかし、あなたが何かを暗号化する場合は、ただ一種の、論理的に考えてみれば、
あなたは少なくとももう少し作業をする必要があります。
PSET 2ではあなたはカエサルやVigenereあるいはクラック、実装されている場合
単に文字列を出力するのは比較的簡単です。
暗号化してから、最低限の文字列を出力すると、もう少し作業が必要です。
>> GoogleやFacebookのような超人気サイトのために、
あなたは、彼らが訪問したすべての単一のWebページに対してユーザーごとに多くの作業を行う必要がある場合
それはちょうどより多くのCPU時間がかかります。
あなたがより多くのCPU時間を必要とするなら、あなたは、より多くのサーバーを必要とするかもしれない
それはあなたがより多くのお金を必要とするかもしれないことを意味します。
と非常に多くの年のために、これは本当にベストプラクティスではありませんでした。
人々は、彼らがするために必要な唯一のSSL暗号化を使用します。
しかし、それが判明し、Firesheepと、この仲間としてスーパークリアは行われ
時現在Facebook上で現在君たち -
好奇心から、あなたは素直に認めるだろうか見てみましょう。
それが前景ていない場合でも、あなたは、現在いくつかのタブでFacebookを使っているのであれば、
あなたのURLにHTTPまたはHTTPSですか？
[複数の学生] S. S？ [笑い]
オーケー。任意のHTTP？わずか1？オーケー。
だから、私たちのすべては今その男のFacebookのアカウントをハックすることができます。
ほとんどの部分については、これは、少なくともいくつかのウェブサイトでは、デフォルトではオンになっています。
あなたのWeb​​トラフィックは暗号化されていない場合、ショートストーリーと長い、
HTMLには、暗号化されていないWiFis渡っ行き来しないだけでなく、
ように、クッキーのようなものが空気を通して前後に行くのですか
暗号化の任意のフォームなし。
あなただけのプログラミングに精通のビットやスキルをグーグルのビットを持っているので、もし
これを行うフリーソフトを見つけるために、あなたがしなければならないすべては、スターバックスに座っている
または一般的に無線LANが暗号化されていないの空港で座って
またはPHPSESSID：とだけのSet-Cookieなどのキーワードを監視
あなたが技術に精通している場合だけで無線LANを監視するため
このパターンの空気全体に流れているすべてのビットのために、
あなたは、次に男のPHPSESSIDがbo8dalなどであることを起こると言うことができます。
そして、再びあなたは、十分に技術的に精通しているか、適切なツールを持っている場合
あなたは、ちょうど再構成し、独自のブラウザがその手のスタンプを提示することを開始することができます
Facebook.com、Facebookにちょうどあなたがその人であると仮定しようとしている
彼らが知っているすべてはあなたが誰であるかではありませんが、このユニークな識別子を持っていること。ので
あなたがそのユニークな識別子を盗み、自分のようにWebサーバに提示しそうだとすれば、
彼らはただあなたにその人のニュースフィードを表示しようとしている
またはその人のメッセージやポーク。
>> そして、私はおそらくFacebookのHTTPSを有効にする方法を現在はGoogleだろう。
しかし、それは本当にそのように簡単です。
そしてそうFacebookとGoogleなどが、これで本当に良い得ている
しかし、HTTPを使用していないあなたが訪問するあらゆるウェブサイトのためのすべてのより多くのアウト目を離さない
そして、それらの上の機密情報のいくつかの種類がある
それは金融や個人だか好きかどうか。
彼らがこれを使用していない場合は、かなり可能性がこのようなクッキーは非常に簡単に盗まれる可能性があります
その後偽造、それは正確にFiresheepがやったことだ。
あなたがプログラマである必要はありませんでした。
あなたがしなければならなかったすべては、この無料のツールをダウンロードし、インターネットに接続されていました
あなたはログインしたあとに、それはあなたのFacebookの名前が表示されるでしょう、何がどうなることです
あなたの周りに、この特定のデモでは、サンダースのみんなの
そしてあなたがしなければならなかったすべては、自分の名前をクリックすると、ソフトウェアは、プロセスを自動化した
自分としてFacebookにそれを提示、そのCookieを盗聴、
そして、ほら、あなたがログインしている
だから、これはそれらの公式には "これをしない"の別の1つです。
あなた自身のホームネットワークを持っていて、手を加えたい場合は、すべての手段によって、
しかし、これは大学の環境上のラインを越えるん実現。
>> しかし、ここでの目標は、これを実行しないことをどのように強調するために実際にある
しかし、物事のこれらの種類を防御する方法について説明します。
それ自体には欠陥があるにもかかわらず、ここと自明な解、
本当に常にHTTPSを使用していないサイトの使用を減らすことである。
だからFacebookとGoogleのようなサイトはますますチェックボックスを持っている
どこで、この種のことにで選ぶことができます
銀行が同様の理由で年間これを持っていた。
だから不安要因我々ができる場合のほんの少し。しかし、それは一言で言えばそれだ。
この機能では、サーバーはあなたが誰であるか覚えているかということです。
とすぐに、彼らはあなたが誰であるかを思い出すことができるように、彼らはあなたについての何かを覚えることができる
プログラマは、$ _SESSIONスーパーグローバル変数と呼ばれるこの特別の内部に格納されていること。
とPSET 7のために我々は、単にint型を覚えておくことが自明にそれを使用している
つまりログインしているユーザの一意のIDは、
ので、我々は知っている彼らは前にそこにしてきた。
その後、セッションやクッキーなどに何か質問はありますか？
Firesheepは、もはやとしてうまく機能しません
そしてあなたは特別な無差別モードにコンピュータを配置する必要があります
ので、実際に自分自身以外のトラフィックをリッスンしています。
あなたが現在Firesheepをダウンロードしているそうだとすれば、それは非常に簡単ではありません実現
それは、かつて実証することであったとして。
かしこまりました。とサンダースでそれを行うことはありません。自宅でそれを行う。
データベース。
我々は非常に意図的にpsetの7でやったことの一つ
我々は、いくつかのユーザーIDを持っているユーザーのためにあなたにサンプル·データベース·テーブルを与えるた
その中にいくつかのユーザー名、およびいくつかの暗号化パスワード。
実行済みでない場合、あなたがわかるように、あなたがテーブルを少し変更する必要があるとしている。
あなたは、そのテーブル内の各ユーザーにいくつかのキャッシュを追加する必要があるとしている
そしてあなたは、ポートフォリオのテーブルを別の履歴テーブルを追加する必要があるとしている、
または多分それは何か他のものと呼ぶ。
しかし、これを行う方法を考えるという点で、このツールを開いてみましょう
我々は金曜日に使用されますが、慣れていない場合、アプライアンスは、ツールに付属している
偶然PHPで書かれていると呼ばれるphpMyAdminは、
しかし、生活の中で、その目的は、私は真紅とjharvardとしてここにログインした後、
私に私のデータベースを表示したり、変更するユーザーフレンドリーな方法を提供することです。
>> 私は、アプライアンス上で実行しているというデータベースはMySQLと呼ばれています。
、これは非常に人気があり、それを使うのは驚くほど簡単です、無料のオープンソース·データベースの
特にこのようなフロントエンドである。
このツールは私が行うことができますどのような、例えば、テーブルの周り突くです。
私が先に行くとこれをやってみましょう。
金曜日に、我々は超簡単だった学生と呼ばれるテーブルを作成しました。
ID、名前、電子メール - - それは3つの列を持っていたと私は手動で行のカップルを挿入
この特定の例のようにダビデとマイク。
のは、このビットをさらに見てみましょう、我々は多くを覚えておきたいことを想定してみましょう
ユーザについてだけ、名前と電子メールより。
上部にここにアップ構造私をクリックしてみましょう。
そして再び、psetには、ここで必要な手順を、順を追って説明
これのいくつかは少し速いがないような場合は心配しないでください。
それから私は、ここでクリックするつもりです。
私は電子メールの後に列をいくつか追加するつもりだ
私は家のようなものを追加したいので。
私は学生の家を記録するのを忘れていました。
私は、[Go]をクリックします、そして、今、私たちは残念ながら左から右へ少し広いです、このフォームを、持ってみましょう
しかし私は、このフィールドの家の名前を呼ぶつもりです
と入力し、私はここで選択する必要があります。
それでは、MySQLで様々な種類についての簡単なチャットをお聞かせ
なぜなら、PHPは弱く型付け、それは一種の高速と型を持つ緩い果たしているのに対し、
データベースでは特にそれが実際にあなたの利点に型指定を使用する超重要だ
物事MySQLと他のデータベースエンジンの1つがあなたのために行うことができるので、
あなたのデータベースに不正なデータを入れていないことを確認しています。
これは、使用可能なチェックエラーフリーのようなものです。
>> 家のために、我々は、明らかにそれはMySQLの32ビット値であるint、なりたくない。
我々は、char型の変数の長さを表しvarchar型、約金曜に簡潔に話した。
これは何ですか？これは、あなたが、これはある種の文字列にしたいことを指定することができます。
あなたは本当に、それがどれくらい長いか事前にわかっていない
従って私達は任意に、家の名は255文字以下に設定できますと言うでしょう
しかし、あなたは32、64で行くことができる - 任意の数を本当に。
しかし、charと呼ばれるフィールドの上にvarchar型を使用することの利点は何ですか？
私はここだけで直感的にスクロールダウンする場合は、CHARありとvarcharがあり気付く。
varchar型はchar可変長であり、charは固定長のCHARです。
だから、唯一のその定義に基づいて、これらのそれぞれの利点や欠点は何ですか？
言い換えれば、誰が区別気遣うか、なぜあなたは気にする必要があります？
>> うん。 [学生] VARCHARは、より多くの柔軟性を持っていますが、より多くのメモリを占有します。
グッド。 VARCHARはもっと占有 - 見てみましょう。私はその権利を聞いたかどうかはよく知りません。
あなたはもう一度それを言うことはできますか？
[学生]私はvarchar型は、おそらくより多くの柔軟性を持っていますが、それはより多くのメモリを占有すると述べた。
興味深い。オーケー。 VARCHARは、おそらくより多くの柔軟性を提供しますが、より多くのメモリを占有します。
後者は必ずしも真ではありません。
それは文脈に依存しますが、のはそれに戻ってくることができます。
>> [聞き取れない生徒の応答]その通りです。
これは、実際にはcharが一般的に多くのメモリを使用する場合だ
charは、C言語のように、文字列のようなものですので、それは文字の配列です。
ですから、長さが255のCHARフィールドを言えば、
データベースには、文字通りあなたに255文字を与えるために起こっている。
家はMatherと6文字が合計されて終了した場合、
あなたは200を超える文字を無駄にしています。
>> 必要であるように効果的にvarchar型だけ多くの文字を使用するように
まで最大量まで。
しかし、あなたが支払う価格は、潜在的に、実際のパフォーマンスです。
- あなたのすべての文字列が8文字になるだろうしていることが事前にわかっている場合
例えば、あなたは長さ8のパスワードを必要とすると仮定する -
的ではありませんが、多くの場合、機会にchar型のフィールドを使用する利点
パスワードのような何かのために固定長を指定することです
今ので、データベースも賢くすることができます。
それはすべてのCHARフィールドは、列内のすべての文字列が同じ長さであることを知っている場合、
あなたは、ランダム·アクセスの機能を取り戻す。
あなたは、データベーステーブルにさまざまなcharフィールドの間を飛び回ることができます
なぜなら、行と列としてデータベースのだと思います。
ので、文字列の一つ一つの長さが同一の場合、
あなたが最初のものが0バイトであることを知って、次の1バイトは8です
その後16とし、24など。
すべての文字列が同じ長さであれば、あなたは、はるかに効率的に飛び回ることができます。
だからそれは、パフォーマンスの面で利益になることができます
しかし通常は、事前に知ることの贅沢を持っていない
そうvarcharには、移動する方法です。
ここにも、Facebookが結局に走ったことを別の詳細です。
は、intは偉大であり、我々は、ソートのデフォルトでは、我々は数が欲しいときにいつでもそれらを使用
それは32ビットのみです。
>> Facebookはかなり現在4億人を持っていないにもかかわらず、
複数のアカウントを持つそこに何人かの人々は間違いなくそこだ
開いて閉じられているか、アカウント、
ので、Facebook自身は、私は数年前にintから移行しなければならなかったと信じて
にだけではなく、64ビットで適切に呼ばれるように、BIGINT、。
だから、これはあまりにも設計上の決定です。
あなたの最終的なプロジェクトが始動判明した場合には、驚くほどラッキーだろう
与えるか、または取る、4億円、1人のユーザーを持ち、
その場合にはintを使用して、少し近視眼的であるかもしれません。
しかし、現実には、あなたのユーザテーブルは、intとおそらく大丈夫です。
しかし、psetの7のような何かのために、あなたの履歴テーブルのように、
あなたはetrade.comに進化した場合は、何千、何百万ものユーザーを持っているかもしれません。
だから一方であなたは、40億以上のユーザーを持っていない可能性があり
あなたが持っているそれらのユーザーは時間をかけて40億以上のトランザクションを持っているかもしれない -
購入し、販売しており、彼らの歴史の中で物事。
あなたが予想するようなら - もう一度、これらはあなたがこの大量のデータを持っている場合があるのは良い問題です -
あなたは、intのサイズを超えるデータを予測しなければ、
bigintのような何かと一緒に行くことは頻繁に十分な設計者によって採用されていない方向で
問題であることを行っていないため、人々の姿、
それはそれよりも大きいものを選択するには、この簡単だ。
我々は一定の精度を指定しPSET 7で使用している進
ので、単精度や倍精度の浮動小数点数と実数などを含む問題を回避することができます。
>> そして、いくつかの他のフィールドがここにあります。我々は、いくつかの範囲にそれらに手を振ってます。
しかし、日付、時間、すべてのMySQLで所定のフォーマットを持ってい
と日付ではなくVARCHARと格納日付の利点
データベースは、実際に、様々なフォーマットにそれらを再フォーマットすることができることを意味し
米国形式やヨーロッパ形式等はどうか - しかし、あなたはそれをしたい -
はるかに効率的にそれだけでいくつかの一般的なデータ型はvarcharである場合よりも。
そして、いくつかの他のBINARY、VARBINARY、BLOBはそこだ。
これらは、バイナリ·ラージ·オブジェクトであり、あなたはまた、バイナリデータを格納することができます
同様に、データベース内の幾何学的なデータとして。
しかし、私たちのために、我々は一般的にint型とVARCHARのなど気にします。
家でこの例を完了してみましょう。
ハウス私は勝手に255文字になると言うつもりです。
デフォルト値は、我々はこれを行うことができます。
我々は、デフォルトでは、例えば、マザーハウスで皆を置くことができます。
それは我々がそのデータベースを指定することができる方法です
誰かが常に値を持っていることを確認する必要があります。しかし、私はそれがあるままにしておきます。
実際には、家の中にキャンパスを離れて住んでいるとしない人々のために、
多分私は実際に、家のためのデフォルト値がNULLであることを指定したい
そして私は、このチェックボックスをオンにし、ユーザーの家がNULLである場合、それは大丈夫だ、データベースを指示する必要があります。
>> 繰り返しますが、これはあなたの場所に置くことができる別の防御機構である
ので、あなたも、必ずしもあなたのPHPのコードでそれを配置する必要はありません。
データベースは、物事があるか、またはNULLでないことを保証します。
そして、最後に、属性。
これらのどれもあまり関係ありません。
バイナリは、署名されていない - それらのどれもvarchar型に関係ありません。
インデックス。
誰もが知っているか、またはインデックスが何かについて推測を覚えているか、持っていますか
家のような何かのために？
これも実際に重要であり、比較的容易に設計上の決定です。
まだそれを見ていない人のために、金曜日に、私たちは、主キーについて簡単に話をしました。
データベーステーブルに、主キーは、フィールドまたは列です
それは、表の行を一意に識別します。
だから我々はIDを持っている現在のテーブルでは、我々は名前と電子メールを持っている。
それらのどれが、主キーに最適な候補である
行を一意に識別するため、その役割は？
おそらくIDを指定します。
間違いなく、我々はまた、何でも使用できますか？
理論的にはそれはユニークなので、たぶん、あなたは電子メールを使用することができます
人々は、電子メールアカウントを共有している場合を除きます。
しかし、現実には、1234のような数字のIDを使用している場合ということです
メールアドレスはこのバイト数またはこのバイト数かもしれない一方で、それは、32ビットのみです。
だから、一意の識別子のための効率の観点から、
それだけでint型を使用することをお勧めする傾向がある
あなたは間違いなく使用することができることをいくつかの文字列候補を持っている場合でも。
>> 家のようなものは、これは主キーであってはならない
その後、唯一1人がメイザーに住んでいて、製革などで1人。可能性があるため、
同様に、これは一意でなければいけません。
プライマリとユニークの違いは、私たちの現在のテーブルの場合とで
IDが主であろうが、電子メールは、我々は先に述べた理由により、プライマリではありません -
パフォーマンス - しかし、それはまだ一意でなければなりません。
だからあなたはまだ主張をせずに一意性を強制することができます
それは超重要な主なフィールドだという。
しかし、この1つは非常に便利です：インデックス。
あなたは、PSET 7用、または一般的に、あなたの最終的なプロジェクトのために、事前に知っていれば
このフィールドの家はあなたがたくさんで検索するものであることを行っている
selectキーワードまたは何か他のものを使用して、
その後は先手を打って、その魔法を動作するようにデータベースを伝えることができます
それは必要なメモリ内の任意の空想のデータ構造を作成していることを確認してください
家に基づいて検索を迅速化する。
たぶんそれは、ハッシュテーブルを使用しますが、多分それはリンクされたリストを使用します。
現実には、それは木を使用する傾向があり、しばしば構造は、B-treeと呼ばれる -
しないバイナリツリーが、Bツリー - 非常に広い木である
あなたは、CS124のようなクラス、データ構造クラスに表示される可能性がある。
しかし、短期的には、スマートデータベースソフトウェアを使用しているときに心配する必要はありません。
"私はより効率的にそれを検索できるようにインデックスは、このフィールドを"あなたはただ、それを伝えることができます
>> あなたがこれをオフのままにして、マザーに住んでいる、データベース内のすべての人を検索しようとする場合、
それは線形探索に委譲されます。
そして、あなたは、いくつかの家の中で6000学部生すべての生活を持っている場合
あなたは、Matheritesを見つけるためにテーブル全体を検索するつもりだ
[インデックス言うなら、うまくいけばそれは対数検索に近いものになり、一方
学生のこれらの種類を見つけることができます。
これは、オンにするだけで無料の機能です
それは空間の一部の金額の価格で来ていなくても。
最後に、自動インクリメント、このAIフィールド、
それはちょうどそれがintの場合を意味し、あなた自身でそれをインクリメントするために気を使いたくなかった
新規ユーザーがあるたびに、それを確認し、
そして挿入され、各ユーザーは、自動的に新しいIDを取得します。
Let 'sは、[保存]をクリックし、今度はこの設計の欠点を見つけることができます。
私は、Browse、マイクと私の家の両方がNULLであることを通知に行けば。
私はこれを手動で編集するためにphpMyAdminを使用することができます。
私は、Enterを押して次にここに行くとマザーの型とすることができます
、今からテーブルに気づくとは異なります。
しかし、私は同様に他の何かを行うことがわかります。
DavidさんのIDは1ですので、phpMyAdminは再び単なる管理ツールです。
これは、ユーザーが今まで見に行くされてものではありません。
私の代わりにトップアップ[SQL]タブをクリックしそうだとすれば -
そして再び、PSET 7は、これらのクエリの多くを紹介します -
私は手動でSQL構造化クエリ言語のコマンドを実行することができます
WHERE ID = 1家= 'Pfoho' SETユーザーを更新。
これらのSQLクエリは、素​​敵なことに、左から右にかなり読みやすいです。
usersテーブルを更新し、Pfohoに家と呼ばれるフィールドを設定する
ユーザーのIDは1です。
または私も先の電子メール= 'malan@harvard.edu'行うことができます。
だから長い一意私を識別するように、それは同様に動作します。
しかし、IDは、より高いパフォーマンスになりがちなので、そんなことしてみましょう。
[Go]をクリックしてみましょう。さて、lecture.usersは存在しません。私のエラーは何ですか？
実際にここに呼ばれるテーブルは何ですか？
それは我々が左上にここまでやったことだからといってそれは学生と呼ばれています。
それは学生ではなく、ユーザーと呼ばれています。だから今、Goをクリックします。
1行が影響を受ける。クエリーは0.01秒かかった。
私はPfohoに今、今マラン生活を参照]をクリックした場合。
だからそれはSQLの別の味だが、psetにはそのもう少し見ていきます。
>> 私はすでにここに作った愚かな決定があります。
私は、このデータベース設計が非効率的であると主張するだろう
なぜなら、私が学生のテーブルに追加する、より多くの人々、
私達のより多くの私は、私は追加を開始TFのより多くの追加を開始
我々は、この表に冗長かを見るために開始するつもりだ？
>> うん。それは学生のだということを見て、我​​々は同じを使用している[学生] [聞こえない]
同じ - そう、まさに。
400人メイザーに住んでいるのであれば、与えるか、または取る、
最終的には、この表では、 ""マザー "、"メイザーを言う400行を持っているとしている
"マザー" "マザー" "マザー"。
我々は、これらのすべてのバイトを無駄にしていると、持ち帰りのカップルはそこだ。
1、誰かがたくさんのお金を支払えばク​​レイジーコーナーケースはあり
と改名メイザー、我々は今我々のデータベース全体のテーブルを変更する必要があります。
Pfohoがかつて15年前に北家と呼ばれていたにもかかわらず、しばしば起こることはないだろうつまり、
ので、それが起こる。しかし、それがすべてではその説得力はありません。
バルク·データを更新する必要があるのようなコーナーケースより魅力的な
あなたが何度も何度も何度も何度もマザーを格納しているデータベース理由のためですか？
つまり、文字、6文字の多くのです。
特にPforzheimerため、それよりもさらに良い我々を行うことはできませんか？
確かに私たちは多くの文字よりよくすることができます。
理由だけではなく、それぞれの家で、固有の識別子を関連付けないで
と、ユーザーごとにその店？それでは、これを試してみましょう。
ちょうど学生のテーブルを使用するのではなく、私は左上にここまで私の講演データベースまで行くことができます。
ここで注意してくださいそれはテーブルを作成しますと言います。
私は家と呼ばれる新しいテーブルを作成してみましょう。
列の数が2であることを行っている。入力します。
今、私は2つのフィールドを持っています。
私はこの名前を呼ぶつもりです、そして、それは長さが255のvarchar型になるだろう、
>> それはかなり恣意的だ。私は慣例によりここにこれを入れてみましょう。
だからここにIDを入れます。家ごとに一意の識別子を指定してみましょう。
すべての家に名前をつけましょう。
の識別子は、正数のみを使用するだけで慣例により、符号なしとなることを指定しましょう​​。
先に進み、今のところ、この自動インクリメントフィールドを挙げてみましょう。
そして、我々は何が必要なのでしょうか？
先に進み、[保存]をクリックしてみましょう。
今、私は2番目のテーブルを持っています。
余談ですが、これは少し不可解なSQLコマンドであることに気づく
あなたは、phpMyAdminのような管理ツールを使用していない場合は、手動で入力しなければならなかったであろう。
我々はそれを使用するもう一つの理由は、そう。
あなたの周りをクリックすることができますので、それは素晴らしく教育的に有用なものだ
そして物事がコピーとphpMyAdminが何をしたか貼り付けて、作業方法を見つけ出す。
しかし、CREATE TABLEコマンドは直前に実行されたものであり、ここに私のテーブルです。
私は今、先に行くと、[挿入]タブをクリックすることで、単純化し過ぎるのではなく、生のSQLを使用してみましょう。
私は、家にINSERTやってみましょう
と私は家の名前は 'マザー'の値を持っているとしていると言うつもりです。
それはそれだ。この構文はもう少し謎めいています。
これは、我々は挿入したいフィールドの名前です。
これらは、我々は、これらのフィールドに挿入する値です。私は、[Go]をクリックしてみましょう。
挿入された1行が0.02秒かかった。私は今、[Browse]をクリックしてみましょう。
>> 私は、[Browse]をクリックした場合に注意し、そのIDを自動化することによって数字の1でメイザーは、あります。
私は別のものをやってみましょう。私は、[SQL]タブに移動してみましょう。
住宅INSERT INTO。家の名前などPfohoの値を持つことになるとされています。
行く。と私は何度も何度も何度もこれをやっておくことができます。
あなたはphpMyAdminを使用して飽きた場合、または、あなただけの[挿入]タブを使用することができます
と生のSQLを入力する必要はありません。
あなたはただ、入力、製革、例えば、次のように入力して、より迅速にそれを強打することができます
我々は[参照]をクリックした場合、現在は、3のIDを使用してキュリアあり。
だから、これは、我々は、自動インクリメントは何を意味です。
しかし、今、私たちは生徒たちに何かを修正する必要があります。
学生の家のフィールドのデータ型は、今何をすべきですか？
それはint型、右すべきですか？
だからここでの目標は、正規として知られているそうでなければ、テーブルを睨むもの​​です
ように、私たちは私のテーブルのいずれかに重複した情報を格納しないでください。
そして再び、我々はここにあったパスは、マザー、マザーを言おうとしている
メイザー、非常に冗長ですメイザー、Pfoho、Pfoho、Pfoho、Pfoho、
charsの無駄に関して。
だから、私が先に行くと構造をクリックして、これを変更してみましょう
そして、私が先に行くと家のフィールドを使用してチェックし、[変更]をクリックしてみましょう
そして今、私はintであるためにこれを変更するつもりです。
255は関連はなくなりました。
私が先に行くと、それはまだNULLの場合、罰金だと言うことができます。保存します。
今すぐテーブルの学生は正常に変更されている、
と再び気づく家はintです。
それはint型になると余談ですが、カッコ内の数字は無視してください。
>> これは、レガシーの理由からです。
戻るあなたはGUIを持っていなかった日には、代わりに、コマンドライン環境を持っていた
あなたが表示されるはずです10と11は、それぞれ指定された文字数
端末ウィンドウで実際にフィールドを表示します。
これは、実際のフィールドのビット長とは何の関係もないので、我々はちょうど今のことを無視します。
今私はこのテーブルに行かなければならない。
ダビデはメイザーに住んでいるならば、その家は、0であってはならない
これは、NULLに最も近いデフォルトのint値です。
彼は家1に生きなければならない。
任意Pfohoでマイクの生活なので、家の番号2としましょう​​。
今、私のテーブルにはもう少し不可解に見える。
しかし、効率を考慮してください。
私は今、家を識別するために32ビットだけを使用しています
これは、私の家MatherとPfohoのわずか1正規定義があることを意味
それは家のテーブルにあります。
私は今、これらのテーブルに再び参加したいのであれば、それはこのように考える。
ここで私は生徒たちのテーブルがあり、右側には、これらの番号は、1と2があります。
1メイザー、2はPfohoです。
私たちは、家と呼ばれるこの他のテーブルにある同じ番号を持っている
それらの3軒の家のために1と2と3。
私たちが今やりたいことは、コード、PHPとSQLの能力を持っている
これらは学生であり、これらは家であれば、これらの表は、再参加のソートする
私たちは、何とかして1となるように1行まで、それらを結合した​​い
2 2とラインアップし、私たちはどこにデビッドを把握することができます
どこでマイクと場所誰もが住んでいます。
これを行うには、我々は次のようなSQLクエリを実行することができます。
学生のSELECT * FROM ON住宅を登録しよう -
そして今、我々に参加するどのような分野をしたいですか？
だからstudents.house = houses.id。
>> ちょっと不可解ですが、この部分は、文字通り新しいテンポラリ·テーブルを作成することを意味
それは、学生や家屋を結合した​​結果だ。
そして、どのようにあなたはここに私の指の先端を結合した​​いのですか？
IDフィールドの生徒の家に等しい家のフィールド 'を設定します。
そして、私は今、[Go]をクリックした場合、私は私が望んだものを正確に取り戻す。
ダビデはメイザーにあり、マイクはPfohoである、と私はまた、ユニークな識別子を参照してください。
しかしポイントは、私は完全なテーブルを持っているようになりました。
PSET 7用または本当に最終的なプロジェクトのために、こことそう持ち帰り：
あなたは、重複した情報のどの部分を保存していることが判明した場合
それは家であろうと、多分それは、都市、州、およびZIPだ
ZIPは通常、常にではないが、ユニークな識別子として使用することができる場所、
phpMyAdminのようなもので、精神的に、その後の運動を経るん
その共通のデータのうちファクタリングのあなたのウェブサイトは、よりよく使われるようなので、特に
多くの人気、これは、あなたはすべてが超高速であることを確認する方法です。
できるだけユニークさなど、多くのヒントとしてデータベースを与えることによって。
それがたくさんあった。
何か質問？かしこまりました。のが5分間の休憩を取ると、再編成しよう。
かしこまりました。
以下は、私がCS161を取ったときに、何年か前に使用した例です。
大学でオペレーティング·システム·クラスはどれですか
驚くべきであることで知られますが、仕事のクレイジーな量されている、
そしてそれは、オペレーティング·システムで発生する低レベルの問題のいくつかに焦点を当てて本当に
とさえもデータベースの世界インチ
>> その年の私の教授、マーゴ·セルツァー、と言われた話は次のとおりであった。
あなたとあなたのルームメイトのために少しの寮の冷蔵庫を持っていると仮定
そしてミルクのような本当にあなたの両方。
したがって、クラス1日から家に帰ってくる、あなたのルームメイトは、まだありません
あなたは冷蔵庫を開け、あなたは気付く、 "いまいましいああ、私たちは牛乳から出ている。"
ですから、冷蔵庫を閉めるには、CVSに通りを歩いて渡る
とCVSでいくつかの牛乳を買うためにますます長い列に並んでもらう。
一方、あなたのルームメイトは、彼または彼女のクラスから戻ってくると、
部屋に入って、実際にいくつかのミルクを欲しがっ冷蔵庫が開き、
冷蔵庫を開いて、 "くそー、ノーミルク。"
だから、彼または彼女は、冷蔵庫を閉じたドアを出て行くと、ABPに行く
あなたがお互いにぶつかるつもりはない、CVS以外の場所または
牛乳を買いに行くために。
もちろん数分後、あなたの両方が戻って家に帰る
そして今、あなたは、あなたが実際に望んで2倍のミルクを持っています。
あなたは牛乳が好きなので、牛乳であること、今ではそれは悪い行くつもりだ
しかし、あなたは牛乳好きじゃないので、今、あなたはあまりにも多くのミルクを持っているので、それはすっぱくなるだろう。
これはひどい、ひどい状況です。
あなたが最初のルームメイトの家だった場合、何がこの苦境を解決しているだろうか？はい。
[学生]あなたがメモを残しておく必要があります。 [笑い]
グッド。あなたがメモを残しておく必要があります。
あなたは "ミルク用に去りぬ"、と言うようなポストイットノートや入れているはず
その後あなたのルームメイトは、概念的には実際にそれをやってからロックアウトされていただろう。
それとも、1歩先に行くことができます。
あなたは文字通り、南京錠のいくつかの種類で冷蔵庫をロックする可能性
そして今あなたのルームメイトは文字通り冷蔵庫からロックアウトされます。
我々は、プログラミングに戻って一般化する場合は、
あなたはほとんど、種の変数または構造体として冷蔵庫から考えることができます
情報のコンテナのいくつかの種類。
根本的にここでの問題は、あなたの両方を検査することを許されたということです
または、このデータ構造の状態を読み取る
しかし、あなたは別の回でそれを見て、まだ両方のあなたの決断を下した
時間内にこれらの異なる瞬間に世界の状態に基づいて。
ですから、冷蔵庫をロックしていた、あなたは少なくともあなたのルームメイトを避けられただろう
世界の状態を検査することができましたから、
ので、彼または彼女は、同じ決断を下していることができなかった。
だからデータベースは、結局のところ、常にこの問題を抱えている。
>> 私たちはシナリオを構築できるかどうか見てみましょう。
あなたが悪者のようなものだと仮定し、バンク·オブ·アメリカへ行く
側でカップルのATM側を持った矩形内の他の場所のうちの一つであるか、
そして、どうにかして、ATMカードを複製する方法を考え出した - すべてのそんなに難しいことではありません。
それはちょうど磁気帯です。
それで、あなたがやろうとしたいのか、このゲームをプレイしている
それによってあなたは、他のマシンに、1機に別のカードを1枚のカードを入れて
そしてあなたは本質的に、同時にお金を引き出すに試してみたい
想像するので、その話は次のようになります。
左のマシンは、あなたのカードと暗証番号を取る
そして、あなたは "私に100ドルを付けます"と言う。
ATMは、最初にそのデータベースまたはそれに相当する上のselectを実行するようプログラムされて -
それが使っているものは何でもデータベース - 表示するには、このユーザは、自分の口座に少なくとも100ドルを持っているのですか？
もしそうなら、100ドルを吐き出すとそのバランスから100ドルを差し引きます。
しかし、もちろん、ここに複数のマシンがある場合、検査などの複数の方法
その世界の状況、銀行の金庫室は、あなたが持っているどのくらいのお金を見て、
左のマシン、右はただ偶然にそれを仮定する
両方は時間的にほぼ同じ瞬間にその質問をする。
>> そして、これは確かに起こることができます。 ATMは、これらの日のコンピュータです。
左のマシンが言うのであれば、 "はい、あなたは、少なくとも100ドルを持っている"
一方、右側のマシンは、 "はい、あなたは、少なくとも$ 100を持っている"と言う。
その後、それらの両方が自分のプログラムを終了し、実際に100ドルを吐き出すに進みます
と "以前は、200ドルを持っていた"と言う。
"私は今、アカウントに残って100ドルであるために、変数を更新してみましょう。"
しかし、それらの両方は、あなたの口座の残高をチェックし、それが200ドルだということを発見した場合
両者はその後、数学をやると言う200 - 100、
マシンは、潜在的には、各マシンに2つの100ドル札を吐き出すた
しかし、彼らは唯一の100ドルであることがあなたの合計口座の残高を更新しました。
言い換えれば、あなたは200ドルを取り出してきましたが、彼らは世界の状態を検査しているため
同時にして、その値に基づいて決定を下し、
彼らは最終的に正しく計算を行うことではないかもしれません。
だから、銀行のような状況でもあなたは本当にロックのいくつかの種類を持ってしたい
ので、できるだけ早くあなたには、いくつかの変数の状態をチェックしてきたように
アカウント残高のように、本当に重要なことだが、
、あなたがあなたのことをやって終了するまで、他の誰かがそれに基づいて意思決定を行うことはできません
このケースでは、左側にATMの場所です。
皆をロックアウトします。
あなたは実際にいくつかの異なる方法でこの効果を達成することができます。
>> MySQLでの最も簡単な方法は、我々はあなたを与えたSQLの行です
まさにこのように見える問題セット仕様インチ
それが呼ばれるものは何でも - - ID、シンボル、および共有、株式数、テーブルに挿入
例えば、以下の値。
あなたはまだ仕様を読んでいない場合、これはどのように行くのですかに関する例です
社長Skroob、このペニー株の10株を買って、
ユーザーIDが7番であることを起こる？
これは、テーブル、次の番号、記号、株式数にINSERT言う
7、 'DVN.V'、および10。
しかし - しかし、しかし、しかし - 二行目は重要なものです。
DUPLICATE KEY UPDATE株式に関する株式= +値（株）。
だから、完全に一目見ただけで不可解な見通し。
それが2行に折り返されていても、このSQLクエリーことが、実際、
1長いクエリですが、それがアトミックであることを意味します
このクエリは、まったくすべて一緒かに関係なく実行されるという意味で。
とMySQLの定義によると、それは彼らがこのクエリを実装する方法は以下の通りです。
それがすべてでは一度かに関係なくすべてを実行するために保証されたマニュアルで定義することです。
この動機は以下の通りです。
このケースでは、株式の10株を購入しようとしている場合は、
それは牛乳と同じ話のようなものだ、それはATMと同じ話のようなものだ。
>> あなたは、この構文を使用していないのを間違えた場合
その代わりに、このペニー株式の株式数は何株を参照するには、データベースから選択する
社長Skroobは、持っている、と彼は10株が含まれているとしない
その後いくつかの一瞬後には、UPDATE文を実行し、
これは、先に行くと、10以上の株式を追加すると言うSQLで別の文です
そう理想的に合計が20であることを彼の現在〜10、
問題は、今日のデータベースシステムで、今日のコンピュータの理由からです
あなたは、複数のプロセッサ、複数のコアを持っている -
つまり、コンピュータは文字通り、一度に複数のことをやってすることができます -
あなたの選択して、このケースでは、UPDATE、その保証はありません
背中合わせに起きようとしている。
そんなに悪いシナリオでは、SELECTを実行するだろう
Skroobがどのように多くのこのペニー株式持っていません見て、
し、ただ偶然、別のデータベース·クエリが実行されます -
多分別のブラウザウィンドウでそのSkroobは10株​​を購入しようとし
別のウィンドウに完全に、多くのATMのような -
と別のクエリがSELECT、UPDATEの間に取得することを仮定します。
それはSkroob現在株式のいくつかの番号を失うことをそうであるかもしれません
別のプロセスが彼の世界の状態を検査していますので、
または彼は彼が持っている必要以上の株式を取得します。
我々は、それらの特定のストーリーラインは次のようになります正確に何の子細に入ることはありません
あなたは、変数の値を確認してから決断をしなければならない場合、ポイントはある
それらの2つの文の間に何かをやって、他の誰かの危険性があったのなら、
としては、マルチコア·システムでは、マルチプロセッサシステムで発生する可能性があります
一度に複数のことを実行する能力を持つコンピュータは、悪いことが起こることができます
のような銀行口座は、二回ほどミルクを買って、間違って引き落とされている
株式またはこの場合の番号が間違っていた。
しかし、このことを考えて、もっと簡単な方法があります。
>> それは、あなたのテーブルを正しく設定している場合、SQLもサポートしていることが判明
私が主張したいの取引と呼ばれるものは、理解することは実際にも簡単です
これよりも、それは1ライナーではないので、実際にはもっと複雑だ。
のSTART TRANSACTIONと呼ばれるSQLステートメントでは、文字通りあります。
そこに、SELECT、INSERT、UPDATE、DELETE、および結合がだと他人の束と同じようにすると、
のSTART TRANSACTIONなどのキーワードがあります。
そして、あなたはその後のpset 7のコンテキストで何をすべきか -
あなたは、pset 7のためにこれを行う必要はありません、それは必要ではないように明示的に否認だが、
しかし、最終的なプロジェクトでは、それは便利です -
あなたは、START TRANSACTION、その後、別のクエリのクエリを呼び出す場合
その後、別のクエリし、別の、もう一つの、別の、
は、SQLステートメントは、COMMITを呼び出すまで、それらのクエリは実際には実行されません
その時点で、それは2文か20文なのか、それらはすべて、一度に実行されます
それは誰もが偶然すぎて牛乳やデビットあまりお金を買うことができないことを意味
あなたのクエリのすべてが実行されるので、またはあまりにも多くの株式を購入する
背中合わせに背中合わせにします。
そして、これはあなたがこのような何かをやっている場合は特に、超重要です。
これはletの銀行口座を更新すると言う任意の例です。
口座番号が2である場合$ 1000 - バランスに等しいバランスを設定することによって。
そして、2番目の文では、今度はその千ドルを堆積させている
その口座番号は1です誰かの銀行口座に。
>> 言い換えれば、これはあなたが確認したい場所の完璧な例です
これらのステートメントの両方が全く起こらないかという
そうでなければ顧客がねじ込まために行っているので
、あなたは、彼らのお金を取ることにして他の場所に堆積しないつもりだ
や銀行はあなたがお金を入金するつもりだどこにねじ込むために起こっている
しかし、実際にユーザのアカウントからそれを減算しない。
それで、あなたはそれらの両方が一緒に実行したい。
したがって、世界の取引を締結している。
だからそれは、あなたの心の奥に留めておくべきものだ
ただ最終的なプロジェクトの目的のためにそんなにしない、
しかし、あなたはどこかにあなたの最終的なプロジェクトを利用したい場合は、
あなたは、その周りにいくつかの会社を立ち上げたい場合
あなたは、キャンパス内にいくつかの学生グループの問題を解決したい場合
そして実際に生きている、アクティブなウェブサイトを持っている、これらが発生する可能性が微妙なバグの夫婦です
あなたは非常に2人いる場合何が起こるかをよく考えていない場合
時間内に文字通り同じ瞬間にあなたのウェブサイトにアクセスしようとしている、
これにより、クエリは、他に織り込まれてしまうかもしれません。
>> いくつかのJavaScript、そのお誘いの準備はできましたか？
これは学期のための私達の最後の言葉です。かしこまりました。
ありがたいことに、JavaScriptは、2言語、CやPHPに非常に、非常に、非常によく似ています
我々はこれまでに行ってきました。
そこのpset 7にはJavaScriptはありませんが、それは非常に便利なツールだ
それは、Webベースの最終的なプロジェクトをやったり、実際には単なるWebプログラミングより一般的になると。
DOMと呼ばれるものの概要を簡単そう。
ここは本当にちょうどこんにちは、世界と言う超簡単なWebページがある
タイトルと本体の両方で。
インデントは、いくつかの時間を示唆してきたように
Webページへの階層は確かに存在する。
私は、木のように、HTMLのこの同じスニペットを描くこと
C言語でのデータ構造のわれわれの議論に戻って考えると、次のとおりであります。
私は、文書ノードと呼ばれるいくつかの特別なルートノードを持つ
私達はちょうどその瞬間にJavaScriptでこのアナログを見ることができます。
この場合の第一子とその唯一の子は、HTMLタグです。
doctypeの直接的なマッピングはありません。
、それは特別なことなので、それはこのDOMに来るとき、我々はそれを無視するべきである
このドキュメント·オブジェクト·モデル·ツリー。
私は矩形として任意に描かれたHTMLタグ、その予告
頭と体：2人の子供を持っています。
>> それらは同様に矩形として描かれています。
それは頭が体の左側にあることを模式的に意味があります。
含意は頭がツリーに最初に来るということです。
ですから、このようにそれを描画するときに、ツリーに順序が実際にあり
形状やその他もろもろは、任意であるにもかかわらず。
ヘッドは、一方、タイトルと呼ばれる単一の子を持って
とタイトルが実際には、 "hello、world"である独自の子を持っています
これは私は意図的に四角形から、それがわずかに異なるにするには、ここに楕円形として描きました。
こんにちは、世界が本当にテキストノードであるのに対し、これらの長方形は、要素です。
だからそれは、ツリー内のノードが、それはノードの異なるタイプです
ので、私は勝手に違ったように描きました。
同様にhelloという名前の子だけでなく、世界を、身体を持っていません
彼らが偶然同じテキストいるにもかかわらずとても異なるノード、
しかし、私は、同じ形状を使用して、それを描いています。だから、誰も気にしない？
さて、HTMLについて素敵なものだ、それがこの階層的な性質を持っていないということです。
そして、何JavaScriptについて素敵だし、自由に利用できます特にライブラリ
とjQueryのような人気のある、あなたはとても驚くほど簡単にツリー構造をナビゲートすることができます。
我々は、ポインタと横断木を使用してCでやったようなもののすべてとノードで再帰する
右の子の左の子、我々が当たり前のように並べ替えることができますすべての突然の
少しイライラしない場合は、驚くほどの啓発であるとして
はなく、ほぼプログラミングについて移動する効率的な方法です。
それで、JavaScriptのようなこれらのより高いレベルの言語で
我々は、はるかに直感的にこのツリーをナビゲートすることができるでしょう。
>> そして確かに構文は非常に精通していることになるだろう。
あなたが前にJavaScriptを見たことがないなら、これは本当に素晴らしい参照です
Mozillaの人々は、Firefoxを作る人、から
ので、あなたの都合に合わせてそれを拾い読みして自由に感じています。
あなたは何を見つけることができます - そしてこれらのスライドは、我々は先日使用したものと同じです -
同様に、メインがなくなっています。
だから、JavaScriptでプログラムを書くとき、何主な機能はありません。
あなただけのコードを書き始める。
しかし、JavaScriptとCとPHPの間の重要な違い
つまりCとPHPはこれまでサーバー側を実行されたのに対し、
この場合のアプライアンスによって、またはより一般的に、サーバーによって、
デザインではJavaScriptを通常ブラウザで実行されています。
言い換えれば、あなたは、我々がうとしているように、JavaScriptコードを書くかもしれない
アプライアンス内のサーバが、あなたはあなたのCSSの間では、HTMLの中でそれを含んで、
あなたのGIFやPNGを使い、あなたのJPEGファイルの間で
もしそうなら、あなたはJavaScriptを使用している場合、ユーザーがWebページを訪問したときにその
そのJavaScriptコードは、サーバーからブラウザに来る
そしてそれは実際にそれを実行するブラウザーです。
だから、これはあっても知的財産のための有意義な意味を持っています。
それも、それはJavaScriptのコードに来るとき、あなたのIPを保護を考える愚かなものだ
言語の性質によって、それは通常ブラウザ側に実行されますので。
>> あなたはそれが狂気と醜い見えるようにすることができますを意味し、それを難読化することができ
スペースなしで、人々があなたのIPアドレスを盗むことが難しくなるために恐ろしい変数名、
しかしキーは、それがブラウザ側に実行されるということです。
さておき、JavaScriptなどのサーバー側を使用することができるにもかかわらず、
最も一般的なユースケースは、現在ブラウザに残っている。
そして、ここではそれがどのように見えるのです。ここでのif-else if-elseのただPHPのように、ちょうどCのような構築物である。
とき "または" 2物事が一緒にここにブール式です。
ここで一緒にしたときには "と" 2物事。
ここではPHPに似ているswitch文があり、
という点では、様々なタイプの値に切り替えることができます。
ループは、同様に、我々は前に見たものとまったく同じように構造化されているここでループのために持っている。
しながらループしておりますが、ループしながらやるんだ。
変数は、ほんの少し異なる。
あなたはPHPとC言語で行うようにして、変数を宣言し、
しかし、同様にJavaScriptを弱く型付けされています。
通常は、そのようなintやfloatや文字列または何も指定しない。
あなたは、varを指定することができます。
あなたは、varを指定する必要はありませんが、そうでない場合、それは意味を持っています。
varを省略した場合は通常、あなたが誤ってではなく、ローカルのグローバル変数を作成します。
だから、変数の名前、あなたはほとんど常にちょうどvarの言うことを私は提案してみましょうと。
それはタイプではない、それは変数のVARだけだ。
これは、123または "hello、world"のものかどうか、例でしょう。
配列が存在し、PHPの文法的に似ています。
私はvar数字を言うだろうし、私は変数を宣言するには、もう一度、角括弧を使用
その型はコンマで区切られ、その中にこれらの特定の番号を持っている配列です。
そして、最後に、これは本当に違って見えるだけです。
PHPで私たちは学生のための連想配列を実装しているであろうことを思い出してください
Zamylaような変数は学生と呼ばれる場所だから、このようになります。
角括弧は、ここで配列が来ることを意味します。
>> 私は数値インデックスが、文字列を使用していないという事実 - イド、家、名前 -
これは連想配列であることを意味します
等号と角度ブラケット付きとこれらの矢印
キーは "id"があることを意味し、値は1です。
鍵は "家"であり、値はウィンスロップハウスです。
キーは "名前"ですが、値がZamylaチャンです。
だから内部の独自の値をそれぞれ有するこの連想配列、の3つのキーがあります。
我々は、pset 7であることを見てきたか、あなたは間もなく、JavaScriptの同じ考えで、
それはこのように見えるだろう。
だから、varの学生は - noドル記号と種類には言及しないが、それでもVAR -
は、キーと値のペアを持っている場合、JavaScriptであるため、中括弧を開き等しく、
実際にはオブジェクトと呼ばれるものを使用しています。
とAPCを取るかのようでしたあなたの人々は、Javaのオブジェクトを思い出すかもしれない
またはそれに似た言語。
JavaScriptは、まず第一に、Javaではありません。
それは、人気がありました何か他のものをノックするために数年前に意図的な設計上の決定だった
その名前、それ自体がJavaには根本的な関係を持っていないにもかかわらず。
JavaScriptはオブジェクトを持って、あなたは中括弧の表記の方法で作成してください。
JavaScriptでのオブジェクトはPHPの連想配列のほとんど同等である
それはそれらの内部のデータを保存するために来るとき。
>> しかし、さらに強力にJavaScriptで、非常に簡単に機能を関連付けることができます
オブジェクトの内側に、あなたは、他の言語でこれを行うことができますけど
我々が見るように、それは、かなり一般的なパラダイムです。
要するに、このオブジェクトには、特にZamylaある学生を、表し、
そしてそれは、概念的にはこれよりわずかに異なる構文的に似ています。
実際にファイルにJavaScriptを使用してみましょう。
scriptタグがあるとアウトそれは変わります。
我々は、styleタグを見てきたし、我々は他のHTMLタグを見てきました。
スクリプトタグは、実際にいくつかのJavaScriptコードが含まれます。
私は、我々はいくつかのソースコードがあらかじめセットされているアプライアンスに行こう。
私はウェブサイト上でそれをまだ投稿していないが、私は授業の後それをやる。
この1、blink.htmlを開いてみましょう。
1990年代に、BLINKタグと呼ばれるHTMLタグは、文字通りありました
これはインターネット上で最も素晴らしく使い古さタグの一つであった
それによってあなたは、いくつかの90年代スタイルのWebページにアクセスし、このようにあなたを点滅するテキストを見て起動したい
テキストこのように起こっていた侯爵タグの結果、。
世界が実際にWeb標準に合意している数少ない例の一つ、
軒並み皆は、何年か前にブリンクタグを殺した。
しかし、我々はあなたが持っている力のデモンストレーションとして、JavaScriptでそれを復活させることができます
あなたがWebページ内のプログラムを書くことができるとき。
まず最初は新しいものを飛ばし、古​​いだけに集中しましょう​​。
>> ここでは、この例では、古いものです。
私は、HTMLタグ、headタグ、タイトルタグを持っている。
それから私は、リコールはちょうど長方形のページの分割であるdiv、とここでbodyタグを持っている
私は、への "挨拶"の任意の一意のIDを与えてくれたこと
ちょうどので、私はいくつかの非常に単純なテキストを持っている唯一それを参照する方法を持っている：
こんにちは、世界。
今私は、このファイルの先頭までスクロールして、何が新しくなったのか見てみましょう。
新しいアップ上部にある最初の事は、スクリプトタグです
とscriptタグの通知の中に私は、関数を宣言した。
PHPに非常に類似したJavaScriptの関数を宣言するには、
あなたは、文字通り、その関数の名前、かっこを、関数を書く
そしておそらくいくつかの引数は、任意のを取る場合。
、それから私はいつものように私の中括弧を持っている、そして今我々はいくつかのわずかに新しいコードを持っている
しかし、これが何を意味するのか見てみましょう。
だから、varのdivは、これはちょうど私と呼ばれる変数のdivを与えることを意味します。
私はそれをfooと呼ばれるかもしれないが、私はそれはdiv要素と呼ばれることを望んで
第二には明らかであろう理由のため。
それはJavaScriptで判明 - そしてこれは私のWebページに埋め込まれたJavaScriptのコードです -
ドキュメントと呼ばれるある種の特別なグローバル変数があります。
JavaScriptは、実際にはオブジェクト指向言語です。
我々は、それが何を意味するかのように50で詳細には触れません
しかし、今のオブジェクトが構造体と非常に良く似ていることを知っている。
最古の問題のいずれかで設定したとき、我々は戻って道を見たような
ここで我々は、構造体で多くの情報を入れ
同様に、ブラウザに付属の専用構造を文書化されている
任意のWebページが付属しています。それは私が作成したものではない。
この文書構造の内部には、しかし、あなたはデータだけでなく、持っている
しかし、あなたはまた、機能を持っています。
>> あなたはオブジェクトの内部、構造体の内部機能を持っており、いつでも、
それはメソッドと呼ばれています。しかし、それは同じことだ。
方法はちょうどので、何か他のものの中にあることを起こる機能です。
この特別なグローバル変数はドキュメントと呼ばれることを意味しますので、
この関数は、文字通りその行いgetElementByIdを呼びかけている。
それはあなたのDOM、ドキュメントオブジェクトモデルツリーから要素を取得する
この場合の挨拶で、そのIDである。
言い換えれば、我々は、データ構造に費やしたすべての時間は、ここで場に出る。
我々は少し前に持っていたDOMのこの絵、
私はこの絵にdivを持っていた場合、ページは、少し異なっているにもかかわらず、
何のdocument.getElementByIdが私に戻ってくると、効果的にポインタであろう
ツリーは、ツリー内の矩形を基準に四角形へ。
だから、それはそれは実際にそれらのいずれかの関数を呼び出すために何を意味するかだ。
この場合、再びそれはdivです。それは、身体またはタイトルはありません。
だから私は、その後すぐに私はそれは、この変数と呼ばれるdivの内側に持っていることをこのdivで何かを見てみましょう。
それはあなたが動的にページのCSSを微調整する能力を持っているJavaScriptを使用して判明した。
今まで、我々は限られたとはいえ、やったCSS、のすべてが、style属性である
または他にどこ私たちは、CSSを入れている？
甘やかされて育ったその1の私は一種。ファイルの先頭にあるstyleタグで。
または3位はでてきた？
>> 外部ファイルは、何か。CSS。
だからそれらは、我々はCSSのこれまで行ってきた3の場所です
しかし、漁獲量は、我々は一生懸命それをすべてコーディングしています。
私たちのCSSはどのようになるか講義前にPSET 7に鳩のようにして決定した、我々は決めた。
あなたのCSSを変更したい場合は、しかし、あなたが実際にそれを行うことができます
一度は、実際のプログラミング言語を持っています。
CSS、HTML、 - しないプログラミング言語。 JavaScriptがある。
だから、できるだけ早くあなたが木からこれらの矩形のいずれかを持っていることが判明
DOMと呼ばれる、それ自体がその中のいくつかのデータを持っています。
だから、僕は木から取っているdiv要素は、我々はその中にプロパティを呼んでいるものがあります
スタイルと呼ばれ、スタイルプロパティは、それ自体が視認性と呼ばれる性質を有している。
私はCSSのユーザーズマニュアルを調べることによって、このことを知っているだろう。
それが言うことない視認性のCSSプロパティがあるとアウトそれは変わります。
それが見えるか見えない、見えるか見えない何かになります。
そして、これはどのようにこれを行うことである。
このdivの視認性が隠されている場合、私は、プログラムで求めている
私はそれを何を変更するのですか？目に見える。
このページの視認性が隠されていない場合は、Else、論理的に私はそれが隠されたことはない。
私はそれが目に見えると隠されたと目に見えるものと見えないではない理由はわかりません。
これは、道に沿って貧弱な設計上の決定だった。
表示と非表示：しかし、それらは確かにCSSで反対語です。
このすべては、オンとオフ、それはオンとオフを私のファイルのCSSを変更することを意味しているん
その特定のdivの。
しかし、再び、これは点滅に呼び出される関数である。点滅機能はいつ呼ばれているのですか？
それは、他の特別なグローバル変数と呼ばれるウィンドウがあることが判明
、文書とその精神においては似ていますが、文書のに対し、あなたのWeb​​ページを参照する
DOMツリーのように、HTMLは、サーバーから送られてきた
ウィンドウには、その周りにクローム、アドレスバー、タイトルバーを指します
あなたのウェブページの周りにそのようなもののすべて。
>> そしてそれは、windowオブジェクトは、setIntervalと呼ばれるそれの特殊な機能を内部に持っていることが判明
それはそれは言うことありません。
それは間隔を設定します - この場合500ミリ秒ごとに -
と、推測を取る、何それは500ミリ秒ごとに何をするつもりだ？
その関数の点滅を実行するために起こっている。
そして、何ここでは素敵なのは、私たちがやったことがないにもかかわらず、我々はC言語でこれを行っている可能性があることです。
Cは、あなたの周りの関数を渡すことができ、関数ポインタと呼ばれるものを持っていません
引数として。
同様に、JavaScriptで別の関数に関数の名前を渡すことができます。
と私がやっていることに気づく。私はこれをやっていないよ。
私は瞬きの後に括弧を置く場合、それは点滅関数を呼び出すことを意味する。
私はここで意味し、それらを省略した場合は点滅機能です
ようのsetIntervalは500ミリ秒ごとに呼び出すことができます。
だからそれでありながら凶悪な最終的な結果は、、、私はlocalhostに行くとblink.htmlに行けば、ということである
私は今、何度も何度もこの出来事を持っています。
そして、私は実際に要素を検査した場合、我々はこれを見ることができるかどうか見てみましょう。
私はエレメントを点検してみましょう、私は少しだけ下にスクロールしてみましょう
私はこっちの要素を選択してみましょう、とChromeのインスペクタのDOM内側に気づく。
それは文字通り、前後に500ミリ秒ごとに変化しています。
私達は私達の友人ネイトに行けば、
あなたは今までの間隔で、これはどのように動作しているか、同様の考えを疑問に思い、場合
しかしネイトは、ここで実際にこの特定のケースの色の非常に有効に活用されています。
だから何より、我々は実際にこれを行うことができますか？
別の例を開き、何かを試してみましょう
それはプログラムで物事が点滅を作るよりも、さらに便利です。
私は今日の我々のformsディレクトリに移動して、form0に行こう。
これは、私が思い付くことを醜い形だった可能性
と私はちょうどそれがブラウザでどのように見えるかお見せしましょう​​。
>> 私は、localhost /フォームに行こう、これはform0です。
これは、パスワードの入力、電子メールのためのいくつかのフィールドを持っている超醜いHTMLフォームです
パスワードを入力し、いくつかの諸条件に同意する]チェックボックスを少し。
私はこのフォームを訪問し、私はあなたに私のメールアドレスを与えたくない場合は、catchは、です
私は多分契約条件に同意したくない、私は、[登録]をクリックすることができます
そして、それはとにかく私を介してすることができます。
これはdump.php呼ばれる愚かなPHPファイルに提出することを起こる。
それはないすべては、単に診断目的のための$ _GETの内容をプリントアウトしています。
それはちょうど今、ユーザによって提出されたものだった。
しかし、我々は実際にユーザのフォーム送信を検証したいとしましょう​​。
私はバージョン1に行こう。
これはform1.htmlです。それは審美的に同じように悪いように見えますが、それがどのように空想に気づく。
協力せずに私の登録]をクリックした場合、私は怒鳴りつけられる。
"あなたはあなたの電子メールアドレスを提供する必要があります。"
かしこまりました。だから私はそれを試してみましょう。だからmalan@harvard.edu。私は、パスワードは必要ありません。
登録します。 "あなたはパスワードを入力する必要があります。"かしこまりました。
だから私は、真紅のパスワードを提供します。登録します。
"パスワードが一致しません。"私は今ここに真紅で入力しなければなりません。
私は誤っていることを確認しました。登録します。
"あなたが契約条件に同意する必要があります。"かしこまりました。そこに同意するものとします。登録します。
そして今、それは私のあそこに診断出力を示しています。
>> だから、何が起こったのか？
我々は、フォーム送信を検証するには、この能力を持っていた。
あなたはPSET 7にダイブをした場合は実際には、謝る機能はあり
それは、画面上のメッセージを持つユーザで叫ぶことをとても簡単に行うことができます。
私はわずかに異なるメカニズム、アラート機能を使用しています
それはそれは非常に醜いユーザメッセージを作る際に微笑んだので、関数ではありません。
しかし、私がここでやってるのか見てみましょう。
これはform1.htmlです、と私はいくつかの非常に使い慣れた構文を持っていることがわかります。
bodyタグ、formタグのaction属性、method属性。
しかし、私は私のフォームの利便性の一意のIDを与えてくれたのに気づく。
それから私は、そのタイプがテキストである電子メールのフィールドを持っている
そのタイプがタイプされたパスワードですパスワード、確認フィールドでパスワードフィールド、
その後、名前がこっちに合意ですチェックボックスは、タイプはチェックボックスです。
そして私は送信ボタンを持っている。
しかし、より多くの私が持っているものを一番上に気付く。
まず第一に、scriptタグの別の使用方法があります。
あなただけのCSSと同じように、別のファイルにいくつかのJavaScriptコードがある場合、あなたはそれを含めることができます。
そして、あなたはスクリプトのソースを使用して行うことが、その後私は明らかに接続しているに気づく
googleapis.comに非常に長いパスへのが、そのファイル名jquery.minで終わる
最低。JS。
jQueryにはJavaScriptを行うJavaScriptのための超人気のライブラリです
使用するすべてのより多くのユーザーフレンドリー。
それは効果的にデファクトスタンダードになってきた。
それで、あなたが見ることについてだがそれ自体が純粋なJavaScriptでなくても、
それははるかにCS50のようなJavaScriptライブラリの上にライブラリが層である
低レベルのCコードの上に、現実にはほとんどインターネット上の誰もがそれを使用しています。
したがって、これらは補助輪ではありません。これは、単に最高のこれらの日の練習である。
今、私の独自のスクリプトタグでその下に気づく、と私はここで何をやったかがわかります。
これは、jQueryが何か少し派手なないことが判明した。
JavaScriptは、ドル記号がありますが、それらは意味がありません。
>> 彼らは、文字またはBまたはCのようなもの
jQueryは単に事実をのんびりとクレームの慣習やソートを採用しています
$は、彼らの特別なシンボルとなること。
だから、できるだけ早くあなたがスクリプトタグと一緒にここにこのグローバルJavaScriptファイルをロードするように、
あなたは$と呼ばれる特殊なグローバル変数にアクセスすることができます。
それは、より適切にはjQueryと呼ばれるが、それは$とほぼ同じくらいセクシーに見えることはありません。
しかし、$は特別な意味はありません。 PHPでそれは特別な意味を持っていた。
あなたは、変数の前にそれを持ってしなければならなかった。
これは、ちょうど彼らが上にかかったセクシーなものです。
ここで何が起こっている？
私はjQueryの関数に私のグローバル変数文書を渡しているに気付く
そして私は呼んでいる。準備が整いました。
何が本質的にjQueryのそれはあなたには、いくつかのバニラのJavaScript物事を取ることができないです
documentオブジェクトのように、ウィンドウオブジェクト、
そしてあなたは、jQueryの関数に渡した場合 -
そして再び、明確にすること、これはjQueryと呼ばれる関数です -
それが何をするかそれはあなたの文書の特別なバージョンを返す
それは、それに関連付けられた多くの機能を持っています。
だから、生のJavaScriptでなくレディ機能はありません、
しかし、あなたが最初にjQueryの関数に文書を渡した場合、
それはあなたに、ドキュメントオブジェクトの特別なバージョンを返す
それはもっと派手な機能を備えています。
人々がそれを好む理由だ。それはちょうど私たちが見るうとしているように、やることが容易になります。
だから、このコード行はどういう意味ですか？
ドキュメントの準備ができたときにこのコード行は、ここでいう -
言い換えれば、一度ブラウザがこのファイル上から下へを読んで行われる -
先に行くと、次の関数を実行します。
何がJavaScriptで本当に面白い - とPHPもこれを持っています -
匿名関数です。
JavaScriptではあなたには名前がありませんが、彼らは肉体を持って行う関数を宣言することができます。
ここで何が起こっているかに注目してください。
>> これは、準備と呼ばれる関数であり、それだけで次の手順を実行します。意味
それは、すべてのサーバーから読み込まれているとき、すべてのWebページには、準備ができています。
あなたは何をしたいのですか？私は、コードをまとめて実行したいと思います。
我々はすぐにこのコードを実行しないことに注意してください。
私はこれを省略した場合は、これらのコード行を実行して起動した直後を意味するでしょう。
しかし、私は、いや、いや、いや言っているという事実は、このように無名関数でこれをラップ
手段はまだそれを実行しません。最終的にそれを呼び出します。
私達は私達の前のフォームの例で一瞬前にこれを見た。
我々は、500ミリ秒後に、最終的にどのような関数を呼び出したのか？が点滅します。
同じ考え方はそう。
繰り返しますが、これは少し奇妙に見えても、ただ信仰で今のところ取る
最終的に呼ばれて無​​名関数を宣言することが、
あなたは単に関数を（）{書く
だから、どのようなコードを、我々は最終的に実行するつもりですか？以下。
これは、あまりにも少し新しいように見えるが、これはここでは、jQueryの関数であることを意味します
そしてこれは今ショートカットです。
もちろん、画面の下部に表示されているHTMLのスニペットは、いくつかのツリー表現を持っています。
これはありません。このページには、このハロー、世界の例よりも興味深いものです。
しかし、このHTMLに対応していくつかの木があります。
これは、再帰関数のいくつかの種類を実装する必要があり、首の痛みであろう
ルートノードから開始し、その後、IDが登録しているノードを見つけることができます。
それでは、jQueryは私たちのために超簡単になり、文字通りこれです。
先に行くと、私を得るものは何でもdivまたはどんな形、どんなHTML要素
登録のIDを持っています。
これは、document.getElementById（ '登録'）と等価である。
>> なぜ、jQueryのような人がいますか？
それは入力するより短いだから。しかし、それはすべてです。それは同じ考えです。
私には、ID登録でタグを取得する。
とフォームであることを起こる、そのタグは、送信されたとき、
先に行くと、このコードを実行します。
それでは、我々はフォームの検証をやっている方法を見て今見て1を取ることができます。
構文は、最初は確かに謎めいていますが、何が起こっているのでしょうか？
このコード行がtrueであれば、私は彼または彼女の電子メールアドレスを提供するためにユーザーを怒鳴りつけるつもりです。
だから、このコード行は何ですか？
$はjQueryのことを意味します。さて、これに気づく。
これはCSSのような種類のものである。
あなたはまだCSSに潜ったことがあれば、これは、IDが登録である要素を意味することがわかります。
スペースは、子または名前が入力され、登録の子孫を見つけることを意味します。
そして、角カッコで囲まれた、このことは、少しフィルターです。
そして、これは不可解なように見えても、これは単に、そのIDを登録した形式に行く意味
名前電子メールであることのinput要素の内側に移動し、
その後、その値があることを起こるものは何でも、その値を取得する -
それは私が入力したものなら、それがすべてのI型またはmalan@harvard.eduだ場合空自。
だから、フォームのemailフィールドの値の場合==何も、ユーザーで叫ぶ。
他のパスワードフィールドの値は==何も、ユーザー怒鳴らない場合。
>> 他のパスワードフィールドの値が確認フィールドの値と等しくない場合には、
他のフォーム要素であった、ユーザー怒鳴りつける。
そして、最後に - そして、この1つはあまりにも、いくつかの独自の構文が新しく追加されてい
一度あなたがそれを見てきたけど、それは、少なくとも、もう少し合理的だ -
IDを持つ登録フォームでは、名前が合意されているinput要素を持っている他の場合
それがチェックされて、先に行くと、ユーザーで叫ぶ。
だから私は完全にこれは一見しただけでは完全に圧倒していると認めている。
これは、新しい構文の多くのです。しかし、jQueryのすべてのパターンのこれらの種類を次の。
そして正直なところ、私も数分前までは、これは存在を知らなかった。
私は、 "チェックボックスをjQueryでチェックされている場合はどのようにチェックしますか？"ググ
それを行うためのさまざまな方法があるので、これは、構文は次のとおりです
実際の生のJavaScriptコードで置き換えます。
だから問題セット7の非常に最初のページが強調するように、
PSET 7は非常に自分自身をブートストラップすることで練習です
ここで我々は、うまくいけば、PSETに取り組むとの概念的なフレームワークを提供してきました。
>> しかし、Webデザインでよくあるケースですが、それは周りをウロウロするのは本当にあなた次第です、
限り、あなたがそれらを引用するように、Webからのコードと例のスニペットを組み込む
その最初のシート上の条件につき、
その学習は、HTML、CSS、JavaScript、さらにはSQLの実現
本当に我々はこれらの補助輪を脱ぎ始めると、このアットホームな運動であることが意味されます。
そして、あまりにもあなたがブラウザを使って行うことができ、よりたくさんのことがあると認識しています。
これらの要素のほとんどの内にイベントハンドラと呼ばれる他のものがあります。
そして、我々だけ、onSubmitおよびonready呼ばれるものを見ていても
あなたは、onkeydownを、onkeyupのようなことを行うことができ
ユーザがキーに触れたときのように、あなたはそれとキーアップのために聞くことができます。
Gmailのキーボードショートカットを持っています。
どのようにGoogleが作成するためのCのようなキーボードショートカットを実装するのですか？
彼らは、OnKeyPressまたはOnKeyUpし、onKeyDownと同様に、彼らが呼ばれているように、イベントをリッスンする。
あなたは今までにいくつかのメニューオプションの上にマウスをホバーしている場合
そして突然、出来上がりのすべてと、メニューが表示され、またはグラフィックの色が変わります
どのように彼らはそれをやっている？
onreadyまたはonSubmitを待ち受けるのではなく、あなたは、onmouseoverイベントやonmouseoutを聞きます。
>> だから簡単に言えば、これらの非常に簡単な基本から、我々は今日の表面に傷を付け始めていることを
そして我々は、ますます、あなたが持っている、水曜日にさらにに飛び込むよ
あなたは既に精通していることの種類を実装するための電力。
それでは、そこに終わらせ、私たちは水曜日にこれを続けていきます。
>> [CS50.TV]