web-dev-qa-db-ja.com

JSを学ぶとき、あなたのアハモーメントは何でしたか？

JavaScriptを学習していたときのことを覚えていますか？突然「わかった」のはいつですか？（たとえば、私のCSSのaha-momentは、ボックスモデルについて学習したときです...）

私が尋ねている理由は、JSを6週間学んでいるからですが、それでもかなり混乱しています。 SOで最近読んだものからの引用です：

「..関数は値と同じように機能します。メソッドは、関数の値を持つオブジェクト（これもオブジェクトです）のプロパティだからです。」

初めにあなたも混乱していたのか、それを理解させたのは何でしたか？.

（私はSitepoints「Simply JavaScript」、本「Eloquent JavaScript」を読んでいて、LyndaのEssential JavaScriptチュートリアルを読んでいます。プログラミングの経験はなく、数学はひどいものでした;）

ありがとう！

javascriptlearning
16
Mattvic

私にとって最大の「AHA」の瞬間は、次のことを完全に理解したときだと思います。

変数の値は、関数を含め、何でもかまいません

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
15
SeanA

私にとって、関数のコンテキスト（thisが指すもの）は任意に変更できることを理解した

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

10
CarlosZ

他のいくつかの回答が触れたことに同意します。 私にとってA-haの瞬間は、理解したクロージャーが何であるかを理解したときでした。

私は質問の回答を投稿しました 閉鎖とは何ですか？ これを説明するのに役立ちます。

クロージャを理解しないと、JavaScriptはかなり限定された言語であり、[]（配列の場合） [〜＃〜] json [〜＃〜] （{}（オブジェクトの場合）、およびブラウザーのコンテキストでは、DOM（window/document）。

ただし、いったんクロージャを理解すると、多くの理解が適切になります：

  • プロトタイプは実際には何ですか（ ここを参照 ）
  • なぜプロトタイプがOOPのキー）（ ここを参照 ）の鍵なのか
  • Javascript really でのイベントハンドラの動作（クロージャを理解しないと魔法のように見える）
  • callbacksを使用して多くのコード（および/または時間）を節約する方法

資源

10
Nicole

私にとってJavascriptで最も重要な言語「Aha」は

  • オブジェクトとして機能
  • 閉鎖
  • プロトタイプベースのオブジェクト指向
  • JavaScriptでのスコープ

これらすべてのトピックについて、ウェブ上で多くのリソースを見つける必要があります。

（そして、すべてが完全に論理的になるとは思わないでください：JavaScript is混乱します）

4
Alexander Gessler

私が数年前に初めてそれを学び始めたとき、私は最初にサーバーサイドのエンド（phpとPerl）からウェブ開発を学び始めたので、javascriptは私にとって困難でした。

構文やOOPまたは私を回避した何かではなく、JavaScriptのライブでイベント駆動型の性格ではありませんでした。 「これで、これで、これで終わりです。ユーザーがページを離れるまで、何かが起こるのを待って応答するという絶え間ない状態にあります。」これは本当に私をループに巻き込みました。

本当に沈んでしまったような具体的な名前を付けることはできないと思います（決定的な "aha！"の瞬間ではありません。特定の瞬間に名前を付ける必要がある場合、私が学んでいたときに言いますAJAX検索候補スクリプトですが、IMOは任意です）しかし、最終的に違いを理解したとき、そこからすべてがはるかに簡単になりました:)

3
Crayon Violent

言語のどの部分でも好きながらくたに再定義できるという考えをようやく理解しました。この点で、Cよりも強力です。たとえば、標準のtoString()関数が気に入らない場合は、独自の関数を実装します。

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

関数オブジェクトにプロパティを設定できることに気づいたとき。

ついにプロトタイプが何であるかを理解した。

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

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

Ahaの瞬間＃1、私にとって：言語であるJavaScriptの実現は、その主な用途である動的HTMLとクライアント側のWebプログラミングとは異なります。 DOMとブラウザーの非互換性に本当にイライラしていたとき、私はJavaScriptにイライラしていました。

Ahaモーメント＃2：継承はさまざまな方法で実行できることを理解する。典型的なクラスベースの継承は1つだけです。他にもプロトタイプベース（JavaScriptで使用されるスタイル）があります。

＃1に関して、私は JavaScript：The Good Parts を推奨することに抵抗することはできません。それ自体がJavaScriptを優れた言語として扱います。

0
Michael Easter

ブロックのスコープと巻き上げはありません。

foo(); // function executes, no error

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

これは、Scheme with syntaxです。

それは私にとって大きな問題でした。

0
Jörg W Mittag
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-haの瞬間。

0
Tomasz Nurkiewicz