เมื่อเรียนรู้ JS อะไรคือช่วงเวลา Aha ของคุณ? [ปิด]

คุณจำตอนที่คุณเรียนรู้จาวาสคริปต์ได้หรือไม่? อะไรคือช่วงเวลาที่คุณ "ได้รับ" ในทันใด (ตัวอย่างเช่น CSS aha-ครู่ของฉันคือเมื่อฉันเรียนรู้เกี่ยวกับรูปแบบกล่อง ... )

เหตุผลที่ฉันถามคือฉันกำลังเรียน JS อยู่ 6 สัปดาห์ แต่ฉันก็ยังรู้สึกสับสนอยู่ดี นี่คือคำพูดจากสิ่งที่ฉันอ่านเมื่อเร็ว ๆ นี้ใน SO:

"..functions ทำหน้าที่คล้ายกับค่าเนื่องจากเมธอดเป็นคุณสมบัติของวัตถุที่มีค่าของฟังก์ชัน (ซึ่งเป็นวัตถุด้วย)"

ฉันอยากรู้ว่าถ้าคุณสับสนในตอนแรกและอะไรที่ทำให้คุณเข้าใจ

(ฉันกำลังอ่าน Sitepoints "เพียงแค่ JavaScript" หนังสือ "Eloquent JavaScript" และการติดตาม Essential JavaScript ของ Lynda ฉันไม่ได้มีการเขียนโปรแกรมที่ยอดเยี่ยมและแย่มากในเรื่องคณิตศาสตร์)

ขอบคุณ!

ฉันคิดว่าช่วงเวลาที่ยิ่งใหญ่ที่สุดสำหรับฉันคือเมื่อฉันเข้าใจสิ่งต่อไปนี้อย่างเต็มที่:

ค่าตัวแปรสามารถเป็นอะไรก็ได้รวมถึงฟังก์ชั่น

var person = {
    name: 'Sean',
    getName: function() { return this.name; },
    numbers: [7, 11, 41]
}

var myvar = person.name;
alert(myvar); //prints name
alert(myvar()); //"myvar" is not a function error
alert(myvar.length); //undefined

myvar = person.getName;
alert(myvar); //prints the contents of the function as a string
alert(myvar()); //calls the function
alert(myvar.length); //undefined

myvar = person.numbers;
alert(myvar); //prints contents of array
alert(myvar()); //"myvar" is not a function error
alert(myvar.length); //prints 3

สำหรับฉันมันเป็นเมื่อฉันเข้าใจว่าบริบท (สิ่งที่thisชี้ไปที่) ของฟังก์ชั่นสามารถเปลี่ยนแปลงได้โดยพลการ

http://www.digital-web.com/articles/scope_in_javascript/

ฉันเห็นด้วยกับคำตอบอื่น ๆ ที่สัมผัสได้ ช่วงเวลา A-ha สำหรับฉันคือเมื่อฉันเข้าใจว่าการปิดคืออะไร

ฉันโพสต์คำตอบสำหรับคำถามการปิดคืออะไร? เพื่อช่วยอธิบายสิ่งนี้

Javascript เป็นภาษาที่ค่อนข้าง จำกัด โดยมีความเข้าใจในการปิดอย่าง จำกัด พร้อมกับคุณลักษณะของชวเลขไวยากรณ์ที่ดีเช่น[]สำหรับอาร์เรย์และJSON ( {}สำหรับวัตถุ) และในบริบทของเบราว์เซอร์ DOM ( window/ document)

อย่างไรก็ตามเมื่อคุณเข้าใจการปิดการทำความเข้าใจจำนวนมากอยู่ในสถานที่ :

• อะไรต้นแบบจริงๆ ( ดูที่นี่ )
• ทำไมต้นแบบเป็นกุญแจสำคัญของ OOP ใน Javascript ( ดูที่นี่ )
• วิธีส่วนใหญ่จัดการเหตุการณ์ใน Javascript จริงๆทำงาน (มันสามารถดูเหมือนเวทมนตร์โดยไม่เข้าใจการปิด)
• วิธีบันทึกรหัสจำนวนมาก (และ / หรือเวลา) ด้วยการโทรกลับ

ทรัพยากร

• ฉันไม่ได้ผ่านทั้งไซต์นี้ แต่ดูเหมือนเป็นแหล่งข้อมูลที่ยอดเยี่ยมโดยแตะที่หัวข้อเหล่านี้: http://eloquentjavascript.net/contents.html
• ตรวจสอบhttp://ejohn.org/apps/learn/สำหรับการสอนที่ดีเกี่ยวกับ Javascript

ฉันคิดว่าภาษาที่สำคัญที่สุด 'Aha สำหรับฉันใน Javascript คือ

• ทำหน้าที่เป็นวัตถุ
• ปิด
• การวางแนววัตถุต้นแบบ
• การกำหนดขอบเขตใน JavaScript

สำหรับหัวข้อเหล่านี้คุณควรค้นหาแหล่งข้อมูลมากมายบนเว็บ

(และไม่คิดว่าทุกอย่างจะกลายเป็นตรรกะทั้งหมด: JavaScript จะทำให้เกิดความสับสน)

จาวาสคริปต์นั้นยากสำหรับฉันเมื่อฉันเริ่มเรียนรู้เมื่อหลายปีก่อนเพราะฉันเริ่มเรียนรู้การพัฒนาเว็บจากจุดสิ้นสุดฝั่งเซิร์ฟเวอร์ของสิ่งต่าง ๆ (php และ perl)

มันไม่ได้เป็นไวยากรณ์หรือ OOP หรืออะไรก็ตามที่ทำให้ฉันหลุดพ้นไปมากมายจาวาสคริปต์ที่ถ่ายทอดสดและเป็นเหตุการณ์ของ javascript เริ่มจาก "ทำสิ่งนี้และสิ่งนี้และสิ่งนี้และสิ่งนี้ และสิ่งนี้และสิ่งนี้และจากนั้นเราอยู่ในสถานะคงที่ของการรอสิ่งที่จะเกิดขึ้นและตอบสนองจนกว่าผู้ใช้ออกจากหน้า " นั่นทำให้ฉันรู้สึกวนซ้ำ

ฉันไม่คิดว่าฉันสามารถตั้งชื่ออะไรได้โดยเฉพาะที่ทำให้มันจมลงในช่วงเวลา (ไม่มีช่วงเวลา "aha!" ที่ชัดเจน - ถ้าฉันต้องตั้งชื่อช่วงเวลาเฉพาะฉันจะพูดว่าเมื่อฉันเรียนรู้ AJAX สำหรับสคริปต์คำแนะนำการค้นหา แต่ IMO นั้นเป็นอะไรก็ได้) แต่เมื่อในที่สุดฉันก็เข้าใจความแตกต่างทุกอย่างก็ง่ายขึ้นจากตรงนั้น :)

ในที่สุดเมื่อฉันเข้าใจความคิดที่ว่าฉันสามารถกำหนดส่วนหนึ่งส่วนใดของภาษาให้กับสิ่งที่อึที่ฉันต้องการ ในแง่นี้มันมีพลังมากกว่าซีตัวอย่างเช่นถ้าฉันไม่ชอบtoString()ฟังก์ชั่นมาตรฐานฉันจะใช้ตัวเอง:

x.toString = function () {
    return "this is MY toString function biatch!";
}

เมื่อฉันรู้ว่าคุณสามารถตั้งค่าคุณสมบัติในฟังก์ชั่นวัตถุ

เมื่อฉันเข้าใจในที่สุดต้นแบบก็คือ

function Alpha(){
    return 'aplha';
}
Alpha.Beta = function(){
    return 'beta';
}
Alpha.prototype.Delta = function(){
    return 'delta';
}

Alpha(); // 'alpha'
Alpha.Beta(); // 'beta'
new Alpha().Delta(); // 'delta'

function Obj() {
    this.x = 42;
    this.value = function() {
        return this.x;
    };
}

var o = new Obj();
o.value();        // 42
var f = o.value;
f();              // undefined??

และa- ฮาช่วงเวลาเมื่อคุณจนจับบนผลลัพธ์เหล่านี้

Aha ครู่ที่ 1, สำหรับฉัน: ตระหนักดีว่า JavaScript, ภาษานั้นแตกต่างจากการใช้งานหลัก: HTML แบบไดนามิกและการเขียนโปรแกรมเว็บฝั่งไคลเอ็นต์ ฉันจะผิดหวังกับ JavaScript เมื่อฉันผิดหวังกับ DOM และเบราว์เซอร์ที่เข้ากันไม่ได้จริงๆ

Aha ครู่ที่ # 2: การทำความเข้าใจว่าการสืบทอดสามารถทำได้หลายวิธี การสืบทอดตามคลาสทั่วไปเป็นเพียงหนึ่ง มีคนอื่น ๆ คือต้นแบบตาม (สไตล์ที่ใช้ใน JavaScript)

ด้วยความเคารพต่อ # 1 ฉันไม่สามารถต้านทานแนะนำJavaScript: ส่วนดี มันถือว่าจาวาสคริปต์เป็นภาษาที่ดีในสิทธิของตนเอง

ไม่มีการกำหนดขอบเขตและการยกของบล็อก

foo(); // function executes, no error

if (...) {
  function foo(){
    ...
  }
}

มันเป็นเพียงโครงการที่มีไวยากรณ์

นั่นคือสิ่งที่ยิ่งใหญ่สำหรับฉัน

jQuery นั้นเป็นช่วงเวลา 'a-ha' สำหรับฉัน ไวยากรณ์รู้สึกคุ้นเคยหลังจากมีประสบการณ์มากมายกับไวยากรณ์ LINQ / lambda ใน C #