WEBVTT

00:00:01.095 --> 00:00:02.997
JavaScript-ის ვებ-გვერდებზე გამოყენების 


00:00:02.997 --> 00:00:06.210
კიდევ ერთი სახალისო ხერხია ობიექტების
დროის მიხედვით ანიმირება.

00:00:06.210 --> 00:00:08.830
მაგრამ სანამ ამაზე გადავლთ

00:00:08.837 --> 00:00:10.379
უნდა დავრწმუნდე, რომ იცით

00:00:10.379 --> 00:00:12.032
სხვა ფართოდ გავრცელებული ცვლადი,

00:00:12.032 --> 00:00:14.934
რომელიც ყველა ვებ-გვერდზე არსებობს,
კერძოდ <i>window</i>

00:00:14.934 --> 00:00:18.334
ახლა მე გავაკეთებ

00:00:18.334 --> 00:00:20.978
<i>console.log(window)</i> და შენ შეგიძლია

00:00:20.978 --> 00:00:23.145
დააპაუზო, შეამოწმო შენი დევაისები

00:00:23.145 --> 00:00:24.897
და ნახო, რა ხდება შიგნით.

00:00:26.887 --> 00:00:30.643
ხედავ? უზარმაზარია.

00:00:30.643 --> 00:00:34.113
უამრავ რამეს შეიცავს.

00:00:34.113 --> 00:00:36.519
ცოტა გავამარტივებ სიტუაციას და

00:00:36.519 --> 00:00:38.436
მხოლოდ ჩემს გამორჩეულ თვისებებსა და 
მეთოდებს

00:00:38.436 --> 00:00:40.675
გაგაცნობ.

00:00:40.675 --> 00:00:44.184
არის <i>window.location</i> რომელიც

00:00:44.184 --> 00:00:46.194
შეიცავს ინფორმაციას გვერდის URL-ის
შესახებ.

00:00:46.194 --> 00:00:50.132
მოდი, პირდაპირ

00:00:50.132 --> 00:00:52.082
გადმოვწეროთ ეს ჩვენს გვერდზე,

00:00:52.082 --> 00:00:55.145
დაპაუზება რომ არ დაგჭირდეს.

00:00:55.145 --> 00:00:59.995
გამოდის
<i>textContent+="The URL of this page</i>

00:00:59.995 --> 00:01:04.097
<i> is + window.location</i> ახლა ესაა ობიექტი

00:01:04.097 --> 00:01:06.803
ამიტომ, შიგნით უნდა ჩავწეროთ

00:01:06.803 --> 00:01:09.460
<i>.href</i> და მზადაა.

00:01:09.460 --> 00:01:12.608
ეს არის iFrame-ში მოქცეული გვერდის URL

00:01:12.608 --> 00:01:14.887
ასე გამოიყურება ის "შიდა სამზარეულოში".

00:01:14.887 --> 00:01:18.466
კიდევ ერთი თვისება: <i>window.navigator.userAgent</i>

00:01:18.466 --> 00:01:21.675
რომელიც გეუბნება, რომელ ბრაუზერს

00:01:21.675 --> 00:01:28.308
იყენებს მომხმარებელი. დავუშვათ, 
<i>"The user Agent is " +</i>

00:01:28.308 --> 00:01:33.653
<i>window.navigator.userAgent;</i>

00:01:33.653 --> 00:01:36.972
თუ ხაზი <i>userAgent</i> ცოტა არანორმალურად

00:01:36.972 --> 00:01:40.339
გეჩვენება, არაუშავს. ის არც არის შექმნილი


00:01:40.339 --> 00:01:43.176
ადამიანის საკითხავ ლიტერატურად და

00:01:43.176 --> 00:01:45.116
მისი ლოგიკა არაა სხვადასხვა ისტორიული 
მოვლენებით განპირობებული.

00:01:45.116 --> 00:01:48.313
დეველოპერების უმეტესობა

00:01:48.313 --> 00:01:51.127
იყენებს ბიბლიოთეკებს იმის გასაგებად,

00:01:51.127 --> 00:01:53.287
თუ რას ნიშნავს ეს ხაზი, რომელ ბრაუზერზე

00:01:53.287 --> 00:01:56.169
მუშაობენ და რომელ ოპერაციულ სისტემაზე და
ა.შ.

00:01:56.169 --> 00:02:00.544
მათთვისაც კი იგი ცოტა უცნაურია

00:02:00.544 --> 00:02:05.332
აი, ცოტა უფრო ნორმალური: <i>window.outerWidth</i>
და <i>window.outherHeight</i>

00:02:05.332 --> 00:02:12.583
დავუშვათ, <i>"This web page is "+</i>

00:02:12.583 --> 00:02:21.544
<i>window.outerWidth + " by " + window.outerHeight;</i>

00:02:21.544 --> 00:02:24.787
მე მეუბნება, რომ ზომებია 1280 715-ზე

00:02:24.787 --> 00:02:26.426
მაგრამ შენთან შეიძლება სხვა იყოს,

00:02:26.426 --> 00:02:29.656
გააჩნია, როგორ გამოიყურება შენი გვერდი
როცა

00:02:29.656 --> 00:02:31.859
ამ ტუტორიალს უყურებ.

00:02:31.859 --> 00:02:33.928
ახლა ნახე:

00:02:33.928 --> 00:02:37.778
წავშლი კოდის ამ ხაზიდან

00:02:37.778 --> 00:02:40.552
<i>window</i> ნაწილს.

00:02:43.472 --> 00:02:48.215
ყვეალფერი მაინც მუშაობს, იმიტომ რომ

00:02:48.215 --> 00:02:50.543
<i>window</i> არის

00:02:50.543 --> 00:02:53.242
ვებ-გვერდების ჩაშენებული ცვლადი.

00:02:53.242 --> 00:02:56.531
როცა ბრაუზერი ეძებს, რომელ ცვლადს იყენებ

00:02:56.531 --> 00:02:58.687
ის მას <i>window</i> ობიეტში ეძებს.

00:02:58.687 --> 00:03:02.043
როცა შენ ახალ საერთო ცვლადს ქმნი,

00:03:02.043 --> 00:03:05.181
<i>window</i> ობიექტი მას ინახავს

00:03:05.181 --> 00:03:08.025
როგორც თვისებას.

00:03:08.025 --> 00:03:10.482
ეს ნიშნავს, რომ შენ არ უნდა გამოაცხადო

00:03:10.482 --> 00:03:13.318
საკუთარი <i>outerWidth and outerHeight</i>
ცვლადები,

00:03:13.318 --> 00:03:16.050
იმიტომ რომ ისინი გადააჭარბებენ 
<i>window.outerWidth</i>

00:03:16.050 --> 00:03:18.847
და <i>window.outHeight</i> ცვლადებს.

00:03:18.847 --> 00:03:21.156
ისედაც, უნდა მოერიდო გლაბალურ ცვლადებს

00:03:21.156 --> 00:03:23.218
იმიტომ რომ შესაძლებელია

00:03:23.218 --> 00:03:26.090
ისინი კონფლიკტში შევიდნენ ერთმანეთთან

00:03:26.090 --> 00:03:28.336
ან სხვა არსეულ ცვლადებთან <i>window</i>-ში

00:03:28.336 --> 00:03:32.256
უსაფრთხოების გასაძლიერებლად შეგიძლიათ 
გამოიყენოთ გლობალური ცვლადების ინდექსირება

00:03:32.256 --> 00:03:35.921
მაგალითად, ხანის აკადემიაზე გლაბალური
ცვლადების წინ ვწერთ

00:03:35.921 --> 00:03:39.979
ინდექსს <i>KA_</i>

00:03:39.979 --> 00:03:42.007
მოკლედ, ესაა <i>window</i> ობიექტი,

00:03:42.007 --> 00:03:44.457
ახლა ვნახოთ, როგორ შეიძლება 
მისი ორი ფუნქციის გამოყენება

00:03:44.457 --> 00:03:47.815
ანიმაციების შესაქმნელად.