JavaScript_javascriptスキルにおけるFunction関数とObjectオブジェクトの関係

関数は JavaScript で最も一般的に使用される概念です。JavaScript の関数は最も簡単に始めることができますが、JavaScript を理解して習得するのが最も難しい概念でもあります。

今日は、関数とオブジェクトの関係について理解することにします。もちろん、私も例外ではありません。

注: 公式定義: Javascript では、すべての関数は実際には関数オブジェクトです。

最初に、最も理解しやすい 2 つの最も単純なコードを見てみましょう。

function fn(){}
var obj = {}
console.log(fn instanceof Function)//true
console.log(obj instanceof Object)//true
console.log(fn instanceof Object)//true
console.log(obj instanceof Function)//false

最初の 2 つの印刷効果は誰にとっても簡単に理解できます。次の fninstanceof Object も同様です。JavaScript では、すべての関数は実際には関数オブジェクトです。奇妙ではありません。objinstanceofFunction は関数ではなくオブジェクトなので、もちろん奇妙ではありません。

別のコードを見てみましょう

console.log(Function instanceof Object); // true
console.log(Object instanceof Function); // true

コードは非常に単純です。実行中の構造はどちらも true ですが、最初の構造では関数の定義が使用されています (JavaScript の関数は実際には関数オブジェクトです)。もちろんこれは true ですが、どうなのでしょうか。 2 つ目はオブジェクトも関数ですか?

オブジェクトの構造は関数 Object(){ネイティブ コード} であるため、オブジェクトも関数です。

この形式では、それが宣言されたオブジェクト関数であることは明らかであり、これはもちろん関数であるため、両方とも true です。

関数とオブジェクトの 2 つの関数の実装コードはもちろん異なりますが、詳しくは説明しません。学習したい場合は、ブラウザに関する関連知識を学習してください。

追記: $(function(){}) と $(document).ready(function(){})

document.ready と onload の違い - JavaScript ドキュメント読み込み完了イベント

ページがロードされるときに 2 つのイベントがあります

最初の準備が完了しました。これは、ドキュメント構造がロードされたことを意味します (画像などの非テキスト メディア ファイルを除く)

2 番目は onload で、画像やその他のファイルを含むページのすべての要素がロードされたことを示します。

jQ を使用する多くの人は、次のようなスクリプトを書き始めます:

$(function(){
// do something
});

実際、これは jq ready() の略語であり、以下と同等です:

これは Dom Ready である jq ready() のメソッドです。その機能または意味は、DOM がロードされた後に DOM を操作できることです。

$(document).ready(function(){
//do something
})
//或者下面这个方法，jQuer的默认参数是：“document”；
$().ready(function(){
//do something
})

一般に、ページが最初に読み込みに応答する順序は、ドメイン名の解決 - HTML の読み込み - js と css の読み込み - 画像やその他の情報の読み込みです。

「jsとcssの読み込み」と「画像やその他の情報の読み込み」の間にDom Readyがあれば、Domを操作できるようになります。

1.window.onload メソッド

⑴実行タイミング:

Web ページ内のすべての要素 (要素に関連するすべてのファイルを含む) がブラウザーに完全に読み込まれた後に実行されます。つまり、この時点で JavaScript は Web ページ内のすべての要素にアクセスできます。

⑵複数の用途:

window.onload=function(){ $(window).load(function(){
//编写代码 等价于 //编写代码
} });

JavaScript の onload イベントは一度に 1 つの関数への参照のみを保存でき、前の関数は最後の関数で自動的に上書きされます。

function one()
{ alert("one");
} 
function two()
{ alert("two"); 
}
window.onload=one; 
window.onload=two; //运行代码后只有 two 

2.$(document).ready() メソッド

⑴ 実行タイミング: DOM の準備が完了したときに呼び出すことができます。 (これは、これらの要素に関連付けられたファイルがダウンロードされたことを意味するものではありません)

例: $(document).ready() メソッドは、DOM の準備ができていることがわかっているときに動作でき、すべてのイメージがダウンロードされるまで待つ必要はありません。

⑵複数の用途: