DAVID J. مالان: خوب، بنابراین این در اینجا بازوی میو است باند، یک زن و شوهر که ما برای پروژه های نهایی CS50 داشته باشد. و این تظاهرات ما صف بود شما در پیش است که در آن اساسا این بازوی نسبتا تنگ باند در اینجا گوش به حرکت عضلات شما که پس از آن در نرم افزار نقشه برداری به لپ تاپ کولتون بر اینجا که حال آیتونز و آهنگ در حال حاضر صف تا. به جای من این demoing، کولتون را در آزمایشگاه است به وضوح تمام هفته گرفتن تظاهرات آماده برای یک داوطلب شجاع. اگر کسی می خواهم به در up-- دیدم دست خود را برای اولین بار. بیا تا. [00:01:09] همه راست. و آنچه به نام شما است؟ 

[00:01:13] رسید آه، ماریا. 

[00:01:14] DAVID J. مالان: ماریا، خوب به شما را ببینید. بیا اینجا. اجازه بدهید به شما به کولتون معرفی. کولتون، این ماریا است. 

[00:01:21] کولتون: سلام، از ملاقات شما خوشبختم. 

[00:01:23] DAVID J. مالان: همه درست است، بنابراین گام اول، ما هستیم رفتن به شما قرار داده این به ساعد شما به طوری که آن را بسیار تنگ در نزدیکی آرنج خود را. و در عین حال، بیایید قرار داده و در شیشه ای گوگل ما و ما از فن آوری های امروز مخلوط کنید. 

[00:01:33] کولتون: اول ما به قلاب به این چیزها. 

[00:01:36] DAVID J. مالان: OK. در واقع، اجازه دهید بازوی خود را به عنوان قرار داده نزدیک به این کابل که ممکن است به طوری که ما برای اولین بار می توانید آن را همگام سازی کنید تا. 

[00:01:41] کولتون: اجازه دهید این کار را انجام. 

[00:01:42] DAVID J. مالان: و در عین حال، به طوری که که هر کس می تواند یک نگاه نزدیکتر، ما دوربین اندرو بازی شیر یا خط تا بر روی صفحه نمایش وجود دارد. بنابراین ما باید یک کابل USB که که به بازوبند ماریا متصل شود. و اجازه دهید صفحه نمایش کولتون را به هوا پرتاب تا در پروژکتور بعدی. 

[00:02:00] بنابراین کولتون است ثبت نام دستگاه در حال حاضر به عنوان یک میو متصل به این کابل. و در حال حاضر چه ماریا رفتن به انجام لحظه ای است که در واقع از طریق راه رفتن مراحل کالیبراسیون و آموزش نرم افزار چگونه عضلات خود را پاسخ هنگامی که او را خاص از پیش تعریف شده حرکات که این نرم افزار را درک. اگر شما می خواهم به در مقابل صفحه نمایش. OK، تلاش کنم. 

[00:02:30] کولتون: برو مثل این. و مانند آن. و تمام راه را به سمت راست. برو عقب. 

[00:02:35] DAVID J. مالان: OK. دیدگاه های مختلف. این شما نیست. این به ما است. 

[00:02:40] MARIA: OK. DAVID J. مالان: شماره اجازه دهید آن را به بالاتر پس از آن نزدیک به آرنج خود را، و یا حتی سخت تر. همه راست. 

[00:02:52] در اینجا ما بروید. این امر می تواند زمان خوبی برای CS52X. ما وجود دارد. 

[00:02:57] بسیار زیباست. OK. انگشت شست به عهد. 

[00:03:02] بسیار زیباست. گسترش انگشتان دست خود را. خوب است. موج سمت راست. این تعجب را نشان شما با hand-- چپ 

[00:03:17] کولتون: آره، که wierd است. DAVID J. مالان: موج سمت راست و جلو حرکت کند. سریع به جلو به جست و خیز و یا بعد. که از سمت راست به موج OK است. 

[00:03:25] MARIA: من don't-- صبر کنید. 

[00:03:26] DAVID J. مالان: آیا نیازمند برخی کمک؟ 

[00:03:28] کولتون: پس شما قصد این را میپسندند. MARIA: این تبدیل دیگر چیزی، هر چند. کولتون: این است. DAVID J. مالان: آره من نمی دانم چرا آن را به شما نشان leftie. کولتون: چرا شما نمی try-- فقط سعی کنید که مثل این. 

[00:03:38] DAVID J. مالان: بدون؟ شاید رسیدن به بازوی شما یک کمی مستقیم و آن را ناگهانی مثل این. بله، OK، در آمده است. 

[00:03:48] MARIA: من متاسفم. DAVID J. مالان: این تقصیر شما نیست. کولتون: این خوب است. DAVID J. مالان: خوب. Well-- 

[00:03:56] MARIA: ما باید این جست و خیز، پس از آن؟ DAVID J. مالان: بله، اجازه دهید به شما اجازه خاموش قلاب. بنابراین اگر کسی می خواهم به انجام پروژه نهایی با استفاده از این لبه برش سخت افزار، تحقق آن ممکن است فقط را کمی مورد استفاده قرار گرفتن به. و this-- واقعیت این است است که در واقع بسیار خونریزی لبه. 

[00:04:10] این چیزی است که به نام کیت توسعه، که به معنای اساسا قبل از انتشار به طوری که مردم دقیقا می توانید انجام دهید this-- با آن مبارزه، شکل چگونه بدن از مردم کار می کنند با فن آوری است. بنابراین اگر شما می خواهید پس از آن، بعد از سخنرانی، ما می توانیم به شما اجازه می آیند و چاقو را دیگر در آن است. اما در غیر این صورت، دور از تشویق، اگر ما می تواند، برای ماریا برای آینده است. 

[00:04:26] MARIA: با تشکر از شما. 

[00:04:28] DAVID J. مالان: با تشکر از شما. ما به این قطع، اما ما خواهد داد you-- چگونه در مورد یک توپ استرس که اینجا هستید؟ اوه، آره and-- if--، متشکرم. همه راست. بنابراین برای کنجکاو، اگر شما با انتخاب صدای نا آشنا که ما وجود دارد ساخته شده قبل از آن، تلویزیون های شگفت انگیز نشان می دهد که شما باید کاملا شراب خواری شود، تماشای در Netflix بکشد این یکی در اینجا است. 

[00:04:51] SPEAKER 1: خانم ها و آقایان، شعبده باز به نام جاش. 

[00:05:04] DAVID J. مالان: و ظاهرا، آن را چیزی که برای من متن در سخنان کن. به من می گفت که ماریا دیروز بود تولد. تولد خیلی خوشحال از CS50 به ماریا نیز هست. 

[00:05:18] بنابراین شما ممکن است در ماه های اخیر به عنوان خوانده شده که این آقایان در اینجا، استیو بالمر که در واقع کلاس در سال 1977 در دانشگاه، اخیرا مایکروسافت بازنشسته شد. او در مقطع کارشناسی در اینجا بود، پس از آن دو سال بعد خود را در بر داشت دانشکده کسب و کار دانشگاه استنفورد زمانی که تلفن را دریافت کرد تماس بگیرید از یکی از دوستان که خود را سالن پایین زندگی می کردند از او در اینجا در دانشگاه هاروارد. نام آن دوست بیل بود گیتس، و در آن زمان، او در تلاش بود به استخدام استیو به فرد کسب و کار برای اولین بار، واقعا، در یک شرکت کوچک به نام مایکروسافت. 

[00:05:45] کوتاه داستان بلند، استیو در نهایت بیش از برنده شده بود، زمانی که آنها مایکروسافت پیوست فقط 30 کارمند داشت. و در آن زمان او بازنشسته کاملا به تازگی، شرکت به حال 100،000 کارکنان در طول چند سال گذشته. و به این ترتیب از یک وب سایت شناخته شده به عنوان در آستانه آماده این ادای احترام در ویدئو که ما فکر کردم ما به اشتراک گذاشته که به شما می دهد حس که چقدر انرژی استیو به ارمغان می آورد به هر ارائه می دهد او. [VIDEO PLAYBACK] -Microsoft مانند یک فرزند چهارم است. کودکان ترک خانه. در این مورد، من حدس می زنم من دارم می روم خانه. هی بیل، whazzap؟ 

[00:06:23] -Wazzap؟ 

[00:06:24] -Hey، wazzap؟ ما داده شده است فرصت بسیار زیاد است. و بیل به ما این فرصت است. من می خواهم برای تشکر از بیل برای آن. من می خواهم شما را به بیش از حد. سرعت نوآوری رفتن به کند. 

[00:06:42] این رفتن به سریع تر و سریعتر. ممکن است چند رقبا وجود دارد که متاسفانه حذف! 

[00:06:54] من عاشق این شرکت می باشد. بله! من یک PC هستم و دوست دارم این شرکت! 

[00:07:08] توسعه دهندگان، توسعه دهندگان، توسعه دهندگان، توسعه دهندگان، توسعه دهندگان، توسعه دهندگان، توسعه دهندگان، توسعه دهندگان. بله! توسعه دهندگان وب! 

[00:07:19] توسعه دهندگان وب! توسعه دهندگان وب! گوش دادن به چه چیز دیگری شما دریافت بدون پرداخت هزینه اضافی! 

[00:07:28] اجرایی MS-DOS، یک وقت ملاقات تقویم، شمع کارت، یک پد توجه داشته باشید، یک ساعت، یک کنترل پنل. و، می تواند به شما آن را باور؟ Reversie! 

[00:07:35] رایت آنها را به CD! ارسال ارسال شده در آنها به MSN! شما آنها را ایمیل به دوستان! 

[00:07:40] همه با یک کلیک! یکی مایکروسافت، یک استراتژی، یک team-- متمرکز، منظم، حرفه ای، و متخصص در همه آن چه ما انجام دهد. به من اجازه استفاده از یک خط از فیلم های قدیمی. 

[00:07:52] روابط مانند کوسه ها هستند. آنها حرکت رو به جلو و یا آنها می میرند. من در واقع فکر می کنم تکنولوژی شرکت یکسان است. 

[00:08:01] [END پخش ویدئو] DAVID J. مالان: بنابراین ما تا به خوشحال اعلام کند که استیو خواهد شد به ما ملحق در اینجا در CS50 چهارشنبه آینده در محل معمول زمان در اینجا. فضای احتمال محدود خواهد شد. و بنابراین، به ما بپیوندید در فرد، لطفا امروز سر و یا مدت کوتاهی پس از آن به cs50.harvard.edu/register. 

[00:08:22] و ما به دنبال خواهد داشت تا سه تایید نقاط. نگاه به جلو به آینده روز چهارشنبه در سخنرانی در CS50. در حال حاضر، در خبری دیگر، من به اتفاق افتاد آمده در سراسر این در زرشکی فقط روز دیگر. 

[00:08:34] به نظر می رسد که یکی از کارکنان CS50 است و حداقل یکی از دانش آموزان را CS50 در حال حاضر در حال اجرا برای UC رئيس جمهور و معاون رئيس جمهور، که من به ارمغان آورد به روز خود من به عقب وقتی که من از انتخابات UC طرز ناراحت از دست داد. اما پوشش نقره ای در که من همیشه تعریف این داستان این است که یکی از من مطمئن هستم دلایل بسیاری من از دست رفته انتخابات از فقدان کامل بود از استعداد زیادی برای صحبت های عمومی. و به این ترتیب کاملا صادقانه آن، من رمه را، که تجربه من فکر می کنم سال سوم من، در واقع به سیستم وارد شوید برای انجمن کامپیوتر دانشگاه هاروارد، که گروه در محوطه دانشگاه این است که دارای مذاکرات مختلف فنی و چیزهای دیگر. و من در زمان بیش از تدریس خود سمینارها و در نتیجه فرصت داشتند، فرصت فوق العاده، برای شروع کار بر روی این دقیقا. اما همچنین، من یک فرصت بود در طول این تجربه به خودم HTML تر آموزش دهد. و من شب گذشته توسط procrastinated به دنبال از طریق وب سایت بر اساس HTML من در مانند 1997 ساخته شده، '98، برای من کمپین که به نظر می رسد مثل این اینجا. من می دانم. 

[00:09:29] Because-- و البته، توجه این تصمیم شگفت انگیز طراحی شده در سال 1998 و یا فلان چیز. اولین چیزی که شما می خواهید کاربران بر بازدید از وب سایت خود را انجام دهید این است که به کلیک بر روی لینک دیگر فقط به وب سایت خود را وارد کنید با راهب پشت پرده مانند یک کفن که در آن ظاهرا پلت فرم مبارزه من بود. و این همه شما دریافت است امروز فقط یک تصویر است. اما من خواندن از طریق، مانند، پوسترهای تبلیغاتی من شب گذشته و پلت فرم من. 

[00:09:50] و من در آن زمان عصبانی بود. پلت فرم من was-- جالب بود. بنابراین من را از آن به بعد آرام ام. اما روزی، من دوباره اجرا خواهد شد و امیدوارم بهتر از این زمان. 

[00:10:03] بنابراین HTML، آن زبان است که در آن من ساخته شده که in-- شما به زودی خواهید more-- زیادی را چیزی ما شده ایم است صحبت کردن در مورد از اواخر سال و تا حد زیادی به مصرف در حال حاضر داده که ما به زبان های دیگر نقل مکان کرد. اما اجازه دهید برای فقط یک لحظه مکث و قرار دادن برخی از این چیزها در چهار چوب. بنابراین در یک جمله، چه HTML است؟ 

[00:10:18] یا، آنچه که برای استفاده می شود؟ هر کسی؟ بله. 

[00:10:20] رسید نشانه گذاری برای وب سایت. DAVID J. مالان: نشانه گذاری برای وب سایت. پس از آن یک زبان نشانه گذاری است که شما اجازه می دهد ساختار یک صفحه وب. هدر در اینجا می رود، عنوان در اینجا می رود، بدن اینجا می رود. این حروف برجسته است، این است که italics-- که مرتب سازی بر جزئیات. 

[00:10:33] OK، خوب است. بنابراین CSS you-- و من اجازه می دهد که برخی از آزادی در زمان وجود دارد با حروف درشت، کج (ایتالیک) روبرو و به دلیل که بهتر است با این اجرا. CSS is-- چه؟ در یک جمله می گویند. هر کس در همه. آره. 

[00:10:46] رسید و Embellishments مسائل، مانند چگونه آن را طراحی کنند. DAVID J. مالان: OK، خوب است. Embellishments که به شما اجازه برای طراحی و یا سبک خاصی دراوردن آن با چیزهایی مانند حروف برجسته و کج و رنگ و زیبا نیز بیش موقعیت دانه از عناصر. این نوع اجازه می دهد تا شما را همه چیز مایل آخرین به طوری که اگر، به عنوان مثال، در Pset7، شما ممکن است در خود متوجه صفحه نمونه کارها اگر شما در این مرحله هستید در حال حاضر که یک جدول به طور پیش فرض است که شما برای نشان دادن دارایی های سهام کاربر و به نظر می رسد نقدی احتمالا خیلی زشت به طور پیش فرض با فضای سفید. نوع همه چیز از کهنه با هم در سطر و ستون. 

[00:11:18] خب، با کمی CSS، همانطور که شما ممکن است متوجه، شما در واقع می تواند نیشگون گرفتن و کشیدن که آن را چیزی بسیار بیشتر آشنا و خیلی زیباتر نگاه کنید. بنابراین CSS است در مورد مد سازی از وب سایت. اما پس از آن ما معرفی یکی دیگر از زبان، PHP، که اجازه می دهد به ما چه؟ 

[00:11:36] بیایید فقط چه؟ هر کسی. رو به سرمایه گذاری فراتر از زن و شوهر اول ردیف. آره. 

[00:11:40] رسید تولید محتوای پویا. DAVID J. مالان: کامل. تولید محتوای پویا. و شما می توانید این کار را انجام در هر تعداد از زبان. ما اتفاق می افتد به استفاده از PHP به دلیل آن است در بخش خیلی شبیه به نحو C. 

[00:11:50] اما PHP می کند که دقیقا. این اجازه می دهد تا به صورت پویا تولید خروجی. و برخی از آن خروجی می تواند HTML، به عنوان ما به طور معمول انجام شده است. و آن را نیز، به دلیل آن است یک زبان برنامه نویسی است، مکانیسم از طریق آن ما می توانیم به پایگاه های داده صحبت کنید. 

[00:12:03] و ما می توانیم به نمایش داده شد سرور های دیگر مانند Yahoos برنامه نویسی و انجام هر کاری واقعا که شما ممکن است در غیر این صورت می خواهم به یک کامپیوتر را مجبور به انجام. بنابراین PHP اجازه می دهد که ما شروع به صورت پویا خروجی محتوا. بنابراین با این منطق، من ندارد وب سایت پویا در سال 1998. 

[00:12:16] این فقط یک صفحه وب ایستا بود. مطالب من تا به حال به توان تغییر توسط دستی با جیادیت و یا برخی از معادل آن. اما PHP چیزی است که ما استفاده می شود و یا می تواند مورد استفاده قرار داده اند، و نه، برای چیزی شبیه به وب سایت جدید الورود IMS، که قرار بود به ثبت نام و مدیریت یک لیست از چیزهایی که users-- در واقع در حال تغییر بیش از زمان، حتی اگر ما اتفاق می افتد برای استفاده از پرل، مختلف زبان در آن زمان. 

[00:12:35] و سپس در نهایت، ما معرفی SQL-- زبان ساختارمند جستجو. بنابراین هنوز یک زبان دیگر که برای چه استفاده می شود؟ مورد استفاده برای چه؟ آیا ما می توانیم سرمایه گذاری slight-- OK، ما قصد داریم برای به دست آوردن بسیار دورتر از ارکستر در اینجا. رسید این پروتکل است استفاده می شود به صحبت به پایگاه داده. DAVID J. مالان: پروتکل استفاده می شود به صحبت به پایگاه داده. اجازه بدهید من نیشگون گرفتن و کشیدن. این یک زبان طبیعی استفاده می شود به صحبت databases-- انتخاب و درج و حذف و به روز رسانی و در واقع حتی ویژگی های بیشتری است که ما حتی نمی شیرجه به، اما شما ممکن است بخواهید به explore-- دارند برای کشف، برای یک پروژه نهایی است. بنابراین این تکه های مختلف وجود دارد. 

[00:13:09] و امیدوارم Pset7، حتی اگر خصوصیات آن است بسیار طولانی، آن را به عمد طولانی به شما راه رفتن از طریق این چیزها چگونه همه می توانند با هم تایپ. در حال حاضر، در روز دوشنبه، ما معرفی آخرین زبان ما که ما به طور رسمی را در معرفی course-- است که جاوا اسکریپت. این، مانند PHP، است زبان تفسیر شده است. 

[00:13:25] اما یک تفاوت اصلی من در روز دوشنبه پیشنهاد این است که در حالی که PHP در حال اجرا یا در سرور، تفسیر آن در این مورد دستگاه CS50 است، و یا ممکن است برخی از وب تجاری سرور در اینترنت، به طور کلی جاوا اسکریپت زبان اجرا می شود که در سمت سرویس گیرنده است نه سرور side-- بنابراین در مرورگر. که است که می گویند، درست مثل وقتی که من باز تا کد منبع فیس بوک و تمام یافت از کسانی که فایل های .js، مفهوم بود که در هنگام مراجعه به فیس بوک و یا بیشتر وب سایت های این روزها، شما نه تنها HTML، CSS، نه تنها، اما یک دسته کامل از جاوا اسکریپت کد اغلب در قالب فایل های .js. و سپس آن را به مرورگر خود مک و یا PC-- که کد اجرا می کند. 

[00:14:03] اما مرورگر شما آن را اجرا می کند. شما می توانید در نوع گودال ماسهبازی فکر می کنم. به طوری که کد جاوا اسکریپت نباید قادر به حذف فایل ها بر روی کامپیوتر شما. این نباید قادر به ارسال ایمیل از طرف شما. نوع مرورگر شما از محدود آنچه شما می توانید با آن انجام دهد. 

[00:14:17] بنابراین در این معنا، آن را کمی قدرتمند، شاید، از C. اما جاوا اسکریپت می تواند، به عنوان یک به کنار، بر روی سرور استفاده می شود، هر چند ما تمایل به صحبت نمی در مورد آن در این زمینه. بنابراین در حال حاضر اجازه دهید این هم گره. یک هفته پیش به علاوه، ما برخی از HTML ارائه در left-- صفحه وب فوق العاده خسته کننده است. 

[00:14:34] فقط می گوید: سلام جهان. و پس از آن من در پیشنهاد سمت راست ما نوع می تواند سرقت ایده از بحث ما ساختمان داده در C و فکر می کنم در مورد چگونگی این سلسله مراتبی زبان نشانه گذاری در سمت چپ می تواند کشیده شده یا اجرا شده در حافظه به عنوان یک ساختار درختی واقعی با گره و اشاره گر و کسانی که انواع قطعات. در سمت راست، ما تماس بگیرید که یک سند DOM-- اعتراض Model-- است که فقط راه فانتزی گفتن درخت. 

[00:14:56] در حال حاضر، چرا این مفید است از آن فکر می کنم در این راه؟ از آنجا که در حال حاضر با جاوا اسکریپت، چون ما کد می شود که برای بازی در این محیط زیست، HTML واقعی که به مرورگر فرستاده می شود در حال حاضر و در حال حاضر توسط در حافظه بارگذاری مرورگر به یک درخت در خود کامپیوتر RAM مثل این، ما می توانیم با استفاده از جاوا اسکریپت در واقع گذشتن و یا راه رفتن و یا جست و جو یا تغییر آن درخت DOM با این حال ما می خواهیم. پس در واقع، اگر شما فکر می کنم درباره facebook.com، اگر شما استفاده از قابلیت چت، اگر شما استفاده از جیمیل و ویژگی gchat، هر چیزی که در آن شما باید پیام های دوباره و دوباره آمدن و دوباره، آن پیامها احتمالا، مانند، برچسب LI، برچسب ها فهرست مورد، شاید. 

[00:15:35] یا شاید آنها فقط هستید divs که حفظ ظاهر هر بار پیغام از طریق مسنجر می کنید. و به طوری که فقط بدان معناست چه فیس بوک یا گوگل در حال انجام است هر زمان شما پیام از سرور، آنها احتمالا با استفاده از جاوا اسکریپت فقط به گره دیگر را اضافه کنید این tree-- گره دیگر به این درخت که پس از آن به نظر می رسد فقط بصری مانند یک خط جدید از متن بر روی صفحه نمایش خود را. اما آنها با قرار دادن در این ساختار داده ها. 

[00:15:57] بنابراین در کلاس مانند CS124 و دیگران، نظر شما در واقع کد بیشتر در برابر ارسال ساختمان داده مثل این. اما در حال حاضر در جاوا اسکریپت، ما فقط فرض همه ما از این قابلیت دریافت به صورت رایگان از زبان خود. بنابراین اجازه دهید به عنوان مثال نگاه کنید. 

[00:16:09] به من اجازه باز کردن یک فایل با نام form.html. این فوق العاده ساده است. درست مثل این به نظر می رسد. 

[00:16:15] بدون CSS، بدون فکر به زیبایی شناسی. این تابعی و ظاهرا من درخواست یک ایمیل برای، رمز عبور، رمز عبور را دوباره، و سپس چک به توافق برسند به برخی شرایط و ضوابط. چه کد منبع را برای این به نظر می رسد چیزی است که احتمالا شما ممکن است با حدس می زنم کمی فکر کن. من یک تگ فرم کردم اینجا. 

[00:16:32] اقدام ظاهرا به رفتن رفتن به یک فایل با نام register.php. روش من قصد دارم به استفاده کنید. و بعد من یک متن دارم درست است که نام ایمیل است. 

[00:16:40] من رمز عبور درست کردم که نام رمز عبور است. من دیگر دارم درست است که نام کاربری رمز عبور تایید تا حدودی خودسرانه است. این فقط یک پارامتر HTTP است. 

[00:16:49] و پس از آن ما به جز این که ما استفاده کرده ایم نه از انجمن ریاضی دانشجوی سال اول دانشکده در class-- نسخه ی نمایشی جعبه چک است که نوع فقط برابر چک. و من که مورد تماس بگیرید. بنابراین من به نوعی خودسرانه اما به راحتی نام این زمینه. به طوری که در حال حاضر زمانی که این فرم می شود را مشاهده کنید، اجازه دهید ببینیم که چه چیزی اتفاق می افتد. اگر من malan@harvard.edu انجام دهید، من رمز عبور قرمز را خواهم کرد. من رمز عبور هیچ چیز را خواهم کرد. بیایید همکاری نمی کنند. 

[00:17:10] و من جعبه بررسی کنید. به من اجازه ثبت نام را کلیک کنید. و آن را می گوید، HM، شما ثبت می شود. نه واقعا. 

[00:17:16] اما URL تغییر کرده است. بنابراین این فرم به وضوح اجازه داده شد برای ارسال به register.php. اما احتمالا، من باید ابتلا به برخی از این اشتباهات. در حال حاضر، در Pset7 و برخی از از نمونه های سخنرانی ما، ما به طور کلی می چاپ کنید یک پیام خطا قرمز بزرگ در اینجا گفت: از دست رفته نام، رمز عبور و یا گم شده. ما انجام داده ایم که قبل و ما سمت سرور تشخیص خطا انجام می شود. 

[00:17:37] اما بسیاری از وب سایت های این روزها انجام مشتری تشخیص خطا جانبی که در آن URL تغییر نمی کند. تمام صفحه می کند تازه نیست. شما دریافت می کنید بازخورد فوری از مرورگر. شاید چیزی می رود قرمز. 

[00:17:48] شاید شما تا موسیقی پاپ را دریافت کنید. اما شما بدون اتلاف وقت به ارسال به اطلاعات سرور که ناقص است. بنابراین اجازه دهید ببینیم که چگونه ما ممکن است رسیدن به این ویژگی و همچنین. 

[00:17:56] به من اجازه رفتن به form1.html، که به نظر می رسد همان. اما اگر این بار من انجام malan@harvard.edu و من تایپ قرمز و من همکاری نمی بیشتر اما ثبت نام کلیک کنید، در حال حاضر اطلاع می دهد. این سکسی راه حل نیست. من حداقل گرفتار این خطا. و من هشدار استفاده می شود تابع در JavaScript-- که ما فقط در کلاس با استفاده از. به طور کلی، شما باید از این استفاده نمی چرا که آن را بسیار به سرعت می تواند از دریافت کنترل. اما کلمات عبور با هم مطابقت ندارند خطا است. 

[00:18:19] اجازه بدهید من به جلو و OK را کلیک کنید. اما چه غذای آماده کلیدی در اینجا این است که URL را تغییر دهید. هدر رفتن پس من ناراحت نمی اید زمان سرور درخواست را یک سوال که من می توانستم نمیفهمد پاسخ به خودم. 

[00:18:30] و کاربر، حتی اگر در مورد این صحبت کردن در طولانی تر از کاربر رفتن به در مورد این فکر می کنم، در حال رفتن به بازخورد فوری. هیچ پوشیدگی با وجود اتصال به شبکه می باشد. بنابراین اجازه دهید در این کد منبع است. 

[00:18:40] به نظر می رسد Form1.html ساختاری شبیه اینجا. فرم در واقع همان. اما اجازه دهید ببینیم که چه چیزی من اینجا هستید پایین. و به روش های مختلف برای انجام این کار وجود دارد. و من مستقیم ترین انجام داده ام پیرو اما ظریف ترین راه است. من یک تگ اسکریپت. من پس از آن تماس بگیرید document.getElementByID ('ثبت نام'). و من که ارزش ذخیره در فرم، یک متغیر. 

[00:19:04] بنابراین آنچه را که من انجام می شود؟ شما می توانید از فکر می کنم document.getElementByID عنوان یک تابع خاص است که جاوا اسکریپت به شما می دهد که به معنای واقعی کلمه دست شما اشاره گر به یکی از گره های یا مستطیل در این درخت. بنابراین در حال حاضر که آنچه متغیر فرم ما در جاوا اسکریپت است که در واقع در اشاره. 

[00:19:21] بنابراین در حال حاضر نحو متفاوت است C. اما ما در حال انجام چند چیز در اینجا. یکی، این یکی کمی عجیب و غریب به دنبال، مطمئنا در مقابل C. اما در خط 35 است. بنابراین در سمت چپ form.onsubmit. به یاد بیاورید که onsubmit است مانند یک زمین در ساختار. اگر شما از متغیر به صورت فکر می کنم تازه یک ساختار C، ممکن است برخی از رشته ها داشته باشد. 

[00:19:42] بازگشت در روز، ما نام دانش آموزان به حال، شناسه، خانه ها، آن نوع از زمینه. فقط از onsubmit به عنوان یکی دیگر از زمینه فکر می کنم. اما این یک زمینه خاص به این دلیل که این مرورگر پیش برنامه ریزی شده برای انتظار .onsubmit به یک مقدار مانند یک عدد یا رشته اما در واقع یک تابع است و یا آدرس یک تابع در حافظه کامپیوتر است. 

[00:20:02] و در واقع، این چیزی است که این کلمه کلیدی در اینجا می کند. این می گوید، من یک تابع جدید را. اما آنچه که از نام آن است رفتن به، ظاهرا؟ 

[00:20:09] فکر بازگشت به دوشنبه. نام این چیست عملکرد بر اساس این نحو؟ نه، منظورم این است که به وضوح وجود دارد بدون نام associated-- قطعا در آنچه که من در اینجا برجسته ام نیست. 

[00:20:21] اما این در واقع OK. این یک تابع بی نام، و یا تابع لامبدا به عنوان برخی ممکن است آن را. و این فقط به این معنی است هنوز هم یک تابع. این فقط، شما می توانید آن را با نام صدا نمی زنم. اما این OK. از آنجا دوباره، مرورگر بوده است پیش برنامه ریزی شده توسط شرکت های مانند گوگل یا مایکروسافت یا موزیلا یا دیگران به فقط می دانم که اگر درست .onsubmit در داخل یک عنصر فرم است ارزش، درمان آن را به عنوان یک function-- یک اشاره گر تابع، اگر شما خواهد شد. و آن را هنگامی که فرم ارسال می شود. 

[00:20:46] پس چه کد باید اجرا شود هنگامی که فرم ارسال می شود؟ ظاهرا، همه چیز داخل آکولاد. و این فقط سبک. 

[00:20:53] شما می توانید این کار را انجام مثل ما تمایل به انجام این کار در CS50. اما در جاوا اسکریپت، اکثر مردم تمایل به نگه داشتن آن در همان خط فقط به دلیل آن واضح تر است مرتبط با کلمه کلیدی که تابع. بنابراین در حال حاضر آنچه که من انجام می دهند؟ 

[00:21:03] اگر form.email.value برابر برابر رشته خالی است و یا هیچ چیز، در اینجا هشدار که من قصد دارم برای گفتن، شما باید آدرس ایمیل خود را، و سپس بازگشت نادرست است. و آن را که غلط است که بازگشت فرم از ارائه جلوگیری می کند. در همین حال، اگر مقدار رمز عبور خالی، من قصد دارم به فریاد زدن در کاربر و می گویند، شما باید یک رمز عبور ارائه می دهند. 

[00:21:21] همه چیز در همین حال در حال گرفتن کمی رویایی اینجا. اگر form.password.value نمی form.confirmation.value برابر، زمینه های دیگر، فریاد زدن در کاربر که کلمه عبور به عنوان آنها مطابقت ندارد انجام یک لحظه پیش نیست. و سپس این یکی جذاب کمی به خاطر من می دانم که من می دانستم که مفهومی بررسی نام جعبه چک است. 

[00:21:40] بنابراین من فقط می تواند استفاده از یک علامت تعجب نقطه به نقطه می گویند اگر بررسی است checked-- آن بولی است ارزش، درست یا false-- من در کاربر به همین دلیل داد. در غیر این صورت، اگر ما را از طریق دریافت همه ی این شرایط، اجازه دهید فقط به راست. اجازه دهید که فرم ارسال می شود. و این پس از آن اتفاق می افتد. 

[00:21:56] بیایید در نوع قرمز. بیایید جعبه، ثبت نام را کلیک کنید. و در حال حاضر من را از طریق به مقصد بروید. در حال حاضر، هیچ پایگاه داده وجود دارد. هیچ چیز جالب وجود دارد در register.php. من فقط نیاز به چیزی در واقع به صحبت کنید. بنابراین، اجازه دهید مکث، در اینجا. هر گونه سؤال در مورد آنچه که ما فقط انجام داده ام و یا برخی از این نحو جدید است؟ OK، آره؟ 

[00:22:17] رسید بنابراین هر چک باکس بولی است به صورت خودکار. شما لازم نیست آن را اعلام خواهم. 

[00:22:21] DAVID J. مالان: درست است. هر چک باکس است که از برای شما ارسال فرم HTML به کد جاوا اسکریپت خواهد شد درمان، بله، به عنوان یک بولی value-- درست یا غلط. این سوال خوبی است. در حالی که ارزش های دیگر، از البته، متن، رشته AKA شده است. 

[00:22:36] همه حق است، بنابراین به من اجازه عقب کمی بیشتر است. نقطه تمام این چه بود؟ فقط برای روشن باشد. مانند، ما در حال حاضر می دانیم، حتی از Pset7 و حتی از سخنرانی هفته گذشته نمونه، که ما به وضوح می توانید چک کنید $ _GET $ _POST ببینید در صورتی که کاربر به ما ارزش خالی می باشد. به یاد داشته باشید که تابع خالی در PHP. 

[00:22:54] پس فقط به روشن، چه یکی از دلایلی که ما ممکن است همچنین می خواهید برای انجام این بررسی خطا داخل مرورگر؟ انگیزه در اینجا چیست؟ آره. 

[00:23:06] رسید سریع تر، و شما نمی کنند ارسال اطلاعات بی فایده به سرور. DAVID J. مالان: خوب. این سریع تر. شما ارسال فایده ای ندارند داده ها به سرور. 

[00:23:12] بنابراین شما به عقب بر گردیم بیشتر پاسخ فوری. و به طور کلی، کاربر تجربه بهتر است. در مورد جایگزین فکر می کنم. 

[00:23:17] اگر برای Gmail-- و بود مورد سال ها پیش. فرض کنید یک ایمیل جدید به شما کردم Gmail شما حساب است، اما تنها راه را از طریق برای دیدن این است که به مانند، بارگذاری مجدد کل صفحه. و یا فرض کنید که شما با کلیک بر روی لینک یک ایمیل به خواندن. 

[00:23:29] همه چیز را تا به بازنگری، بنابراین که شما می توانید ایمیل را ببینید. یا Facebook-- یک پیام چت می کنید. شما آن را نمی بیند تا زمانی که شما بارگذاری مجدد صفحه و یا برخی از لینک کلیک کنید. 

[00:23:36] مثل این می شود بدجور تجربه کاربر آزار دهنده است. و این چیزی است که آن را می خواهم، به وضوح، به زمانی که من برای UC زد و وب بسیار کمتر پویا بود و جاوا اسکریپت به عنوان محبوب نمی آن را به عنوان در حال حاضر. و همه چیز بسیار گرفتن پویا تر و خیلی بیشتر سمت سرویس گیرنده در آن احساس. 

[00:23:49] اما گرفتن وجود دارد، و این نوع از مارپیچ آزار دهنده است. فقط به خاطر اینکه شما اضافه سمت سرویس گیرنده تشخیص شبیه به این به این معنا نیست شما می توانید یا باید رها سرور تشخیص سمت. شما در اصل می خواهید برای قرار دادن خود چک کردن خطا در هر دو مکان. از آنجا که آنچه که بود از درس های آموخته شده از مقاله من چند نقل قول به عنوان خوانده شده از این system-- CMS احمق مدیریت محتوا System-- که بود اجرای سیستم احراز هویت خود، ورود به آن از طریق چه مکانیسم؟ جاوا اسکریپت. 

[00:24:20] رسید جاوا اسکریپت. DAVID J. مالان: جاوا اسکریپت، دقیقا، درست است؟ این با استفاده از جاوا اسکریپت. و به معنای واقعی کلمه، شما بچه ها بازی کمی احتمالا با بازرس کروم. و اگر من می توانید آن را پیدا کنید، عنصر بازرسی. 

[00:24:30] به من اجازه رفتن به انجام همه گزینه های کروم. و این است که چگونه از آن آسان است به در یک مرورگر غیر فعال کردن جاوا اسکریپت. بررسی، جاوا اسکریپت نه بیشتر. 

[00:24:38] بنابراین در عدالت، زیادی از وب این روزها فقط رفتن برای شکستن به دلیل جیمیل و دیگر sites-- Facebook-- فرض کنیم که جاوا اسکریپت را فعال کنید. اما اگر شما در حال انجام کاری احمقانه مثل تنها اعتبار کاربران ورودی و چک کردن آن را برای خطا در سمت سرویس گیرنده، دشمن به راحتی می تواند این کار را انجام. و پس از آن حتی دقیق دشمن مثل شما بچه ها در حال حاضر می تواند شبکه راه دور یا حلقه استفاده و یا دستورات خط فرمان فقط و در واقع ارسال پیام به سرور که به همین ترتیب در حال بررسی خطا نیست. 

[00:25:05] پس این بیشتر از یک است کاربر تصمیم رابط از آن است که واقعی فنی improvement-- اجرای سمت چیزی مشتری مثل این. بنابراین در حال حاضر یک نگاه سریع، اما بعد از آن من به پیاده روی آنلاین تسلیم از برای این یکی. در فرم دو، ما در واقع از طریق رفت و تمیز کد کمی. اما اجازه دهید به یکی تسلیم از فیلم ها خواهیم به احتمال زیاد قراردادن در Pset8 که فقط شما نشان می دهد نحو مشابه با استفاده از یک کتابخانه به نام جی کوئری، که فوق العاده، فوق العاده کتابخانه محبوب جاوا اسکریپت در که رک و پوست کنده اکثر مردم فقط استفاده از این روزها و حتی به عنوان اشتباه که خود جاوا اسکریپت. 

[00:25:37] و این امر منجر به درگیری برخی از نشانه هایی دلار و کلمات کلیدی مانند سند در پرانتز در اینجا. اما باز هم، اجازه دهید من به تسلیم برخی از آموزش کندتر آنلاین به جای بلند شدن در فقط نحو گره خورده است. اجازه دهید تا به حرکت چیزی کولر کمی از نظر برنامه های کاربردی از این. 

[00:25:50] بنابراین به طور خاص، به من اجازه رفتن پیش رو و باز کردن این اینجا. بیا. ما وجود دارد. 

[00:25:59] به من اجازه باز کردن این عکس بنویسید. بی ارزش پیچیده به دنبال، اما آن توصیف یک تکنیک به نام AJAX-- آسنکرون جاوا اسکریپت و XML، که در آن X برای XML است که در واقع دیگر واقعا استفاده می شود. این امر منجر به استفاده از چیزی دیگری به نام JSON. 

[00:26:13] اما در اینجا چیزی است که چگونه مانند نقشه های گوگل یا Google Earth کار می کند. اجازه دهید این را امتحان کنید در پرواز، در واقع. اجازه بدهید من به جلو و باز کردن تا کروم در مرورگر من. 

[00:26:21] و اجازه دهید من به رفتن، می گویند، maps.google.com. و در واقع، اگر شما قدیمی هستید به اندازه کافی به یاد داشته باشید آنچه، مانند، MapQuest مانند در روز بود، و شاید آنها هنوز هم مانند این کار می کنند. هنگامی که شما برای جستجوی something-- 33 آکسفورد استریت، کمبریج، ماساچوست، اجازه دهید this-- کار شما که در واقع، اگر شما می خواستم به حرکت به سمت بالا و پایین، چپ و راست، شما می توانید مانند یک نگاه فلش بزرگ در بالا، و آن را به شما نشان می دهد یکی دیگر از قاب از نقشه تا اینجا. یا شما می توانید سمت چپ کلیک کنید و شما بیش از اینجا بروید، و یا دیگر کلیک کنید و شما می توانید بیش از اینجا بروید. اما به جای این روز، ما البته فقط را برای مسلم است که ما می توانیم به در اطراف کمبریج به سرعت فقط با کلیک کردن و کشیدن. اما متوجه برخی اشکالات وجود دارد. 

[00:26:59] اگر من این کار را به اندازه کافی سریع، آنچه به نظر می رسد اتفاق می افتد که من را بکشید، کمی بیش از حد سریع برای کامپیوتر را به نگه دارید تا؟ چه می بینید؟ آره. 

[00:27:07] رسید پیکسل را تازه کردن نیست. DAVID J. مالان: پیکسل را تازه کردن نیست. این actually-- و شما وجود دارد می تواند این در واقع ببینید،، اگر شما تماشای آنلاین و مکث این در واقع یا کند می کند همه چیز را برای once-- شما خواهید دید که وجود دارد کاشی، مربع، مستطیل و یا که از نقشه های از دست رفته تا دوم تقسیم بعد، اطلاعات بیشتر، تصاویر بیشتر در واقع بر روی صفحه نمایش ظاهر می شود. و در واقع، اگر ما این کار را با نگاه تا Chrome's-- اجازه دهید بگویم، Chrome-- بیایید ببینید. ما نمی تواند انجام دهد. 

[00:27:31] اوه، اوه. بیایید باز کردن maps.google.com. اجازه دهید من دوباره پنجره بزرگتر. 

[00:27:36] بازگشت به 33 خیابان آکسفورد. وب سایت من به تازگی بود چه بود؟ من این، مانند، بیهوده گویی خصوصی به حال خودم بودم که پس از آن از طریق مسنجر پیام هر دوست که آنلاین بود که می خواستند به آن را بشنوند. برخی از وب سایت وجود دارد. من فکر می کنم تا Comcast-- ISP بسیار بزرگ آمریکایی است. شما می توانید، هنگام ثبت نام برای کابل جدید خدمات مودم و یا خدمات تلویزیون کابلی، آنها یک شکل بسیار منطقی جایی که آنها شما را برای آدرس خود را بپرسید. و این شگفت انگیز ویژگی به نام خودکار کامل، مانند گوگل، که شروع به پر کردن در پاسخ به سوال شما. 

[00:28:04] مشکل این است که، آنها را به طور کامل خودکار در اولین چیزهایی که شما تایپ می کنید. بنابراین اگر شما شروع به تایپ 33 آن، شما را به معنای واقعی کلمه هر خانه نشان می دهد در امریکا شروع می شود که با شماره 33 قبل از ادامه به انتظار شما را به نوع دیگر. بنابراین اگر شما از نوع 33 آکسفورد، سپس آن را به شما نشان می دهد هر خیابان در امریکا است که 33 در آکسفورد نام خود را، بدون در نظر گرفتن شهر که شما در آن هستید. 

[00:28:25] و سپس شما را به تایپ ادامه. و در نهایت، آن را متوجه می شود که آنها نمی ارائه خدمات به خانه خود را در کمبریج و یا چیزی شبیه به آن. اما نکته این است، این است که بیشتر اجرای نادان از خودرو کامل همیشه. 

[00:28:34] و من فقط رفتن فعال در این مماس دوباره. اما راه های خوبی برای وجود دارد استفاده از جاوا اسکریپت و راه بد است. و این لزوما بهترین نیست. 

[00:28:40] اما نکته در اینجا، پیش از این سخنرانی دراز وشدیداللحن، بود به باز کردن ابزار در اینجا و باز کردن ابزارهای توسعه، همانطور که ما قبل از تشویق کرده ایم، و به تماشای شبکه تب که من واقعا سریع را کلیک کنید. و متوجه یک دسته کامل از دریافت درخواست اتفاق افتاده است. همه این اتفاق افتاده است از آنجایی که من کشیده. 

[00:28:57] و به احتمال زیاد، در واقع بسیاری از این سطرها در حال حاضر تصویر بریده بریده JPEG انواع MIME و یا نوع محتوا. دلیلش این است که آنچه کروم در حال انجام هر بار که من کلیک کنید و بکشید، کلیک کنید و کشیدن است، آن را تحقق، آه، من نیاز به درخواست گوگل برای کاشی بر روی نقشه است که در اینجا، به سرعت آن را از طریق HTTP دانلود، و سپس آن را به اصطلاح DOM اضافه به مرورگرهای وب در درخت حافظه نمایندگی به طوری که کاربر، من، می بیند که کاشی به روز شد. و دلیل این است که از یک تکنیک به نام AJAX. بازگشت در روز، آن را واقعا مورد بود که اگر شما برای تغییر آنچه که بر روی صفحه نمایش می خواستم، شما را مجبور به کلیک کردن، پایین، چپ، سمت راست. و سپس یک صفحه جدید باز می کنم. اما این روزها، همه چیز پویا تر است. آن را در راه اتفاق می افتد که ما انسان امیدوارم که آن را در واقع تعاملی خواهد بود. و آن را به این هدف با راه یک تکنیک به نام AJAX، که شاید بهترین توضیح با یک مثال. اول، اجازه دهید من به جلو و باز کردن یک فایل quote.php در نام کد توزیع امروز. 

[00:29:53] و سپس به من اجازه انجام اوه symbol--. به من اجازه انجام نماد = GOOG فقط برای برخی از سهام. یا در واقع، اجازه دهید انجام یکی از Pset رایگان. را وارد کنید. 

[00:30:05] و در حال حاضر متوجه آنچه که من به عقب بر گردیم. پس این است که واقعا فایل PHP که من کوتاه نوشت که به سادگی قرض کد از تابع گرین کارت آمریکا را Pset7 و تف کردن با استفاده از این آکولاد و نقل قول ها و نماد روده بزرگ، ظاهرا، قیمت سهام فعلی برای شرکتی که شما را در از طریق، عبور کند. بنابراین این متفاوت است از بسیاری از آنچه که ما کرده ایم انجام در که متوجه من به معنای واقعی کلمه تف کردن آنچه به نظر می رسد مانند کد جاوا اسکریپت. 

[00:30:27] در واقع، این یک شی جاوا اسکریپت است. در واقع، تنها به روشن تر، جاوا اسکریپت جسم Notation-- JSON-- فقط یک راه فانتزی گفتن که شما است می تواند در جاوا اسکریپت نشان داده بسیار مثل شما می توانید در PHP با استفاده از جفت ارزش کلیدی است. بنابراین اگر من می خواستم به اعلام یک متغیر در جاوا اسکریپت به نشان Zamyla، برای instance-- یک ساختار برای Zamyla-- و ما آن را دانش آموز، این متغیر. ID او است، خانه است وینتروپ، و نام Zamyla است. 

[00:30:53] اما من نیز می تواند یک آرایه از اشیاء را داشته باشد. بنابراین اگر من در واقع می خواستم به آرایه در جاوا اسکریپت حاوی از جمله اشیاء متعدد، این زمان به نمایندگی از کارکنان، من ممکن است این سه دارند تکه کد بازگشت به عقب برای این عقب سه از کارکنان پیشین. بنابراین نحو، زیبا مشابه both-- به PHP. اما این به خصوص جاوا اسکریپت. این نماد جسم است. پس چه این بسیار مفید است؟ 

[00:31:17] اگر من نوشتن کد که تف کردن JSON-- جاوا اسکریپت جسم Notation-- چیزهای که به نظر می رسد مثل این و یا چیزهای که به نظر می رسد ساختار Zamyla است، من در واقع می تواند استفاده از این در برنامه من ارسال. به من اجازه رفتن به ajax0.html. و این too-- بسیار نیست فکر به زیبایی شناسی داده شده است. اما مراقب آنچه اتفاق می افتد. 

[00:31:34] به من اجازه دهید پیش بروید و نوع آزاد اینجا. کلیک کنید دریافت نقل قول. و متوجه URL تغییر نکرده است. اما من دریافت یک پاپ با ظاهرا پنی قیمت سهام امروز از 0.15 $. بنابراین نه همه که بد است. اما تفاوت در این است که به نحوی، این داده ها به عقب به طور مستقیم آمد به من. اما اجازه دهید گام به سوی چیزی بیشتر آشنا. در یکی از این نسخه، به من اجازه نوع آزاد دوباره، کلیک کنید دریافت نقل قول، و now-- آه، این بود در واقع نسخه از jQuery. بنابراین اجازه دهید me-- من نیست سریع به جلو کاملا به اندازه کافی. اجازه بدهید من به نسخه دو برود، که جایی است که من می خواستم. اطلاعیه آنچه که من در اینجا انجام داده ایم. من یک وب page-- فوق العاده نسخه ساده از هر صفحه وب شما ممکن است امروز با یک فیلد متن استفاده در اینجا به صورت رایگان و پس از آن ظاهرا تنها متن. 

[00:32:14] این یک فرم در اینجا نیست، ظاهرا. اما اگر من کلیک کنید دریافت نقل قول توجه کنید صفحه وب من در مورد به عنوان اینکه من تغییر است فقط یک پیام جدید از طریق مسنجر و یا به عنوان اینکه من فقط نقل مکان کرد نقشه و مورد نیاز برای دریافت اطلاعات بیشتر به صورت پویا به صفحه وب اضافه شده بدون تغییر URL و کاربر تجربه شدن قطع. در واقع، من هنوز در هستم دقیق ajax2.html place-- همان. 

[00:32:35] پس بیایید تنها در این مثال و ببینید که چگونه این اتفاق می افتد. اجازه بدهید من به ajax2.html بروید. و برای اولین بار متوجه فرم. 

[00:32:44] در اینجا، من تبدیل خاموش کامل خودکار. گاهی اوقات آن را می شود آزار دهنده اگر مرورگر در تلاش است به شما نشان دهد تاریخ خود را. بنابراین شما می توانید آن را در HTML توسط انجام فقط گفت: خودکار کامل خاموش است. 

[00:32:53] من این متن درست داده ام symbol-- نه، ID از نماد است. و در حال حاضر، این یک ویژگی جالب است. ما در مورد طول صحبت نیست، اما شما می توانید در مورد آن فکر می کنم مانند یک تگ پاراگراف یا DIV تگ. در آنچه به نام در خط عنصر که معنی است که شما یک بند کنید شکستن در بالا و پایین آن. این فقط رفتن به در خط ماندن بدون هدف قرار دادن معادل را وارد کنید. بنابراین من این تکه از HTML داده اند باید مشخص شود یک شناسه منحصر به فرد که من خودسرانه نام قیمت می باشد. و من یک دکمه ارسال. 

[00:33:21] از آنجا که در حال حاضر تا here-- و این است در واقع فوق العاده شگفت انگیز است که چگونه کد کمی شما می توانید ارسال را به انجام نسبتا شسته و رفته things-- اطلاعیه آنچه که من انجام داده ام تا در اینجا اگر من تا سر از این صفحه حرکت کنید. من برای اولین بار در گنجانده ام سر من برچسب اسکریپت که در واقع منابع جاوا اسکریپت فایل در جای دیگر. این است که از این سازمان که می نویسد از jQuery، و این فقط به شما آخرین نسخه کتابخانه جی کوئری خود را. 

[00:33:42] پس این نوع مانند SHARP در C شامل یا در PHP نیاز دارد. شما با استفاده از تگ اسکریپت با یک ویژگی منبع. اما در حال حاضر کد خود من است رفتن به سمت راست در اینجا. 

[00:33:52] توجه کنید من یک تابع به نام نقل قول. و به نظر می رسد کمی مرموز در نگاه اول. اما اجازه دهید این کسی را دست انداختن از هم جدا. من URL متغیر به نام به من بدهید. اختصاص آن به معنای واقعی کلمه این رشته. بنابراین، به نقل از واحد، به نقل از دو در جاوا اسکریپت فقط به من می دهد یک رشته است. به علاوه چه می کند؟ الحاق. 

[00:34:08] بنابراین در حال حاضر این نحو jQuery است که طول می کشد کمی مورد استفاده قرار گرفتن به. اما این فقط به معنی به دریافت من DOM گره شناسه منحصر به فرد که نماد است. هشتگ وجود دارد به این معنی است نماد شناسه منحصر به فرد. 

[00:34:21] علامت دلار در پرانتز فقط معنی، این بسته بندی در jQuery یک نوع سس مخفی تا شما قابلیت های اضافی دریافت کنید. و سپس .val ظاهرا یک تابع، و یا به عنوان ما در حال حاضر می گویند، روش داخل این گره که فقط به ارزش شما. بنابراین در کوتاه مدت، زشت و گیج کننده به عنوان این به نظر می رسد در نگاه اول، این حالت فقط بدان معناست با کاربر تایپ می کنید در، آن را در انتهای رشته قرار توسط الحاق آن. که همه. 

[00:34:43] بنابراین در حال حاضر، سه خط آخر. شما می توانید تعداد زیادی از فشار قابلیت از سه خط. این علامت دلار، به عنوان یک به کنار، فقط یک نام مستعار است برای یک متغیر خاص جهانی به نام به معنای واقعی کلمه از jQuery. 

[00:34:55] علامت دلار فقط به نظر می رسد سرد. بنابراین جامعه از jQuery فقط نوع از آن به عنوان نماد خاص خود استفاده می شود. به این معنا که آنچه در آن به معنی در PHP. در جاوا اسکریپت، علامت دلار است درست مثل یک حرف از حروف الفبا و یا تعداد برای یک متغیر. 

[00:35:07] شما فقط می توانید آن را به عنوان نام دارند. فقط سرد به نظر می رسد. بنابراین جامعه آن را به عنوان یک نام مستعار به تصویب رسید برای کتابخانه خود را به نام جی کوئری. 

[00:35:13] و آن را فوق العاده محبوب. بنابراین دریافت JSON است که دقیقا. این تابع که دوستان را در jQuery را نوشت که می شود JSON از server-- جاوا اسکریپت نشانه گذاری شی. از چه URL آن را رفتن برای دریافت کنید که اطلاعات؟ ظاهرا از این URL در اینجا. 

[00:35:27] و آنچه که باید انجام به عنوان مرورگر به زودی آن را به عنوان میشود به این پاسخ؟ و این سحر و جادو از AJAX است، پس به speak-- آسنکرون جاوا اسکریپت در XML. این سخت است برای دیدن با چنین مثال ساده که ما در اینجا بود. 

[00:35:41] اما این ناهمزمان در بود به این معنا که من وقتی کد اعدام فرستاده یک پیام به سرور به دریافت من JSON. و آن اتفاق افتاد فوق العاده سریع که من پاسخ دارم. اما آنچه جالب است این است که این خط از کد را کامپیوتر من قطع نکنید. 

[00:35:55] من یک آیکون در حال چرخش را نمی بینم. من از دست دادن نیست توانایی به حرکت موس من. مرورگر من در واقع کاملا خوب بود. 

[00:36:01] از آنجا که راه به جاوا اسکریپت دسته پاسخ از سرور به شرح زیر است. ثبت نام آنچه شما می خواهم تماس بگیرید تابع پاسخ به تماس، که فقط بدان معناست، با سلام، جاوا اسکریپت. به محض این که سرور پاسخ با JSON، لطفا این تابع ناشناس تماس بگیرید. 

[00:36:18] و لطفا به این تابع به تصویب رسید هر رشته به سرور تف به عنوان یک آرگومان به نام داده است. بنابراین در دیگر کلمات، اگر من مونتاژ به صورت پویا quote.php URL عبور در این نماد مانند FREE یا GOOG یا فلان چیز، من پس از آن گفتن جاوا اسکریپت بروید دریافت کنید که URL. به یاد داشته باشید که مرورگر رفتن به بازگشت چیزی که به نظر می رسد که ما شاهد این earlier--. 

[00:36:42] و چه آرگومان دوم در اینجا به JSON است گفت: است به این تابع زمانی که سرور بازگشت می شود آیا آن 10 میلی ثانیه از هم اکنون و یا 10 ثانیه از هم اکنون. و به زودی به عنوان شما انجام دهید، اضافه قیمت را به صفحه. این نحو در اینجا فقط به معنی به دست آوردن گره از درخت که شناسه منحصر به فرد است که طول price-- که قبلا دیدم. 

[00:37:01] این روش به نام HTML فقط می گوید، به جای HTML که وجود دارد با data.price. data.price چه خبر؟ خوب، مرورگر، یاد، به من نشان داد این به آینده را. پس این داده ها می باشد. 

[00:37:14] و پس از آن کمی مرموز برای دیدن کاما اینجا. اما در واقع، به من اجازه انجام این کار. اجازه بدهید من این رب واقعی سریع به جیادیت و نشان می دهد این مثل ما نشان داد ساختار Zamyla را پیش از آن. 

[00:37:27] چه سرور ارسال بازگشته است شی کمی که به نظر می رسد مثل این. و به این ترتیب data.price است فقط به من .1515. بنابراین تعداد زیادی از حرکت قطعات اینجا همه در یک بار. 

[00:37:39] اما takeaways کلیدی است که ما این توانایی به HTTP اضافی درخواست با استفاده از جاوا اسکریپت بدون نیاز به بارگذاری مجدد صفحه. و سپس ما در واقع می تواند تغییر صفحه وب در پرواز. و معلوم است که جاوا اسکریپت و زبان های دیگر را می توان در حال حاضر استفاده نمی شود و تنها به جهش صفحات وب، اما در واقع نرم افزار ارسال در یک کامپیوتر واقعی، نه فقط به کروم و یا مانند محدود. 

[00:38:00] در واقع، if-- کولتون، به نظر شما می خواهم به ما بپیوندید به بالا در اینجا با کد آزمایشگاه خود، و چانگ نیز؟ اجازه دهید به جلو، با صحبت در مورد توابع بی نام و تماس مجدد و واقعا وسوسه سرنوشت در اینجا با نسخه ی نمایشی زنده با خونریزی تکنولوژی لبه، یکی از این دستگاه ها نخبگان حرکت. در حال حاضر، این دستگاه، به یاد بیاورید، یک دستگاه USB کمی است و همچنین that-- که beautiful-- که شاخه به پورت USB خود را. 

[00:38:25] و سپس آن را فراهم می کند ورودی در قالب حرکات انسان با تشخیص با استفاده از پرتوهای مادون قرمز، اساسا، جنبش را از بازوی خود را. بنابراین در حالی که آنچه که ماریا سعی در قبل از عضلانی بود، در واقع احساس چه چیزی در حال تغییر بازوی خود را، این مادون قرمز است استوار است. پس از آن به دنبال جنبش در مرتب کردن بر اساس حوزه یک پا و یا تا از دستگاه خود. 

[00:38:46] پس چرا من نمی کنند چاقو در اولین بار از این؟ و اجازه دهید پیش بروید و پرتاب شما تا در بالای سر در اینجا. بنابراین اجازه دهید لپ تاپ قرار داده کولتون تا اینجا. ما اندرو در تلویزیون کردم. و آنچه را می خواهید من برای انجام اولین؟ 

[00:39:00] کولتون: برو جلو و فقط قرار دادن دست خود را بر روی این پسر و شما برخی از زرق و برق های شگفت آور را ببینید. 

[00:39:04] DAVID J. مالان: بسیار خوب. این همه در زمان واقعی اتفاق می افتد. OK. همه حق است، و بله. بنابراین خوب است. همه حق است، چه چیز دیگری می توانیم انجام دهیم؟ 

[00:39:15] کولتون: رفتن به صفحه بعدی و مشاهده کنید. 

[00:39:17] DAVID J. مالان: خوب. 

[00:39:19] کولتون: یک بازی سرگرم کننده کمی که در آن شما را وادار به ساخت رباتهای. 

[00:39:21] DAVID J. مالان: خوب، پس این دست جعلی نشان دادن من چه کاری انجام شده است. کولتون: بله، پس پیش بروید و گرفتن یکی از بلوک های و آن را در بالای بدن است که ربات است. DAVID J. مالان: آه، دست من وجود دارد. اوه. OK، شایان ستایش. یک دقیقه صبر کنید، OK. ما وجود دارد. 

[00:39:41] کولتون: من یک حادثه ساخته شده است. 

[00:39:43] DAVID J. مالان: OK، من این مرد را دریافت کنید. لعنت به آن! هنگامی که ما تمرین شد این آخرین شب، شما می دانید چه این محول را به؟ 

[00:39:51] مثل این. OK. بعدی؟ 

[00:39:55] کولتون: مطمئنا. 

[00:39:56] DAVID J. مالان: خوب، و در یک سوم وجود دارد. همه راست. کولتون: در این یکی، شما to-- DAVID J. مالان: آه، این یکی از زیبا. کولتون: --yeah، انتخاب این گل از هم جدا. DAVID J. مالان: OK. هیچ؟ از دست رفته. 

[00:40:14] کولتون: اوه، وجود دارد که شما بروید. 

[00:40:15] DAVID J. مالان: آه، در آن است. بسیار زیباست. خب، چرا اصلا 'ما از یک داوطلب در اینجا که مایل به در آمده است. چگونه در مورد سمت راست وجود دارد در سبز، در آن است؟ 

[00:40:27] همه حق است، و اجازه دهید have-- به جای انجام این کار، برخی از شما ممکن است این بازی می دانم here-- قطع طناب، شاید؟ بیایید ببینید. ما عینک ما در اینجا؟ 

[00:40:37] OK. متشکرم. نام شما چیست؟ 

[00:40:39] رسید لورا. 

[00:40:40] DAVID J. مالان: لورا؟ خوب برای دیدن. اگر برای شما مهم نیست با قرار دادن گوگل شیشه ای بیش از عینک خود را. این کولتون است. 

[00:40:46] کولتون: سلام. از ملاقات شما خوشبختم. 

[00:40:48] DAVID J. مالان: OK، در اطراف می آیند. همه حق است، پس چه شما به در اینجا، با این قبل از بازی، است دست خود را بر قرار جهش حرکت در اینجا. و در حال حاضر فلش شما باید حرکت می کند. اوه، نه. 

[00:40:57] رسید شماره 

[00:40:58] DAVID J. مالان: ما نمی خواهید به ترک است. OK، صبر کنید. در اینجا. بنابراین توجه به شما به عنوان پای شما انگشت بر چیزی، ماوس شروع به سبز شدن، که این است که چگونه شما را کلیک کنید. 

[00:41:06] بنابراین بیش از بازی شناور. و فقط یک انگشت خوب است. و در حال حاضر در کمی کلیک کنید مرد سبز در سمت چپ. و در حال حاضر نگه دارید تا آن را پر می تا سبز. خوب است. در حال حاضر، مانند، یک سطح تا بالا. 

[00:41:16] رسید: بله، ما می خواهیم یک سطح، در اینجا. 

[00:41:20] DAVID J. مالان: خوب. OK، پس همه شما باید به انجام قطع طناب. اشاره گر خود را از یک رنگ سفید به پایین وجود دارد. 

[00:41:28] بسیار زیباست. همه حق است، آن را در مورد سخت تر. پس انگشت خود را بر روی بعدی در حال حاضر نگه دارید. خوب است. این یکی سخت است. 

[00:41:39] رسید اوه تلخه. OK. می خواهد برود که راه. اوه تلخه، that-- 

[00:41:44] DAVID J. مالان: آره. هدف دوم این است که گرفتن تمام ستاره ها. همه حق است، بعدی است. 

[00:41:53] بیایید ببینید اگر شما می توانید این یک سوم را دریافت کنید. خوب است. OK، به بیش از وجود دارد. 

[00:42:06] مطمئن شوید. اوه، بسیار خوب. همه راست. 

[00:42:11] پس چرا ما امروز در اینجا موکول؟ اجازه دهید هر کسی در آمده تا که می خواهد به بازی. با تشکر بسیار به لورا داوطلب ما. و ما شما را در روز دوشنبه ببینید. 

[00:42:18] رسید شما احتمالا می خواهید این بازگشت. 

[00:42:21] SPEAKER 2: در CS50-- بعدی