今まで見たことのない JavaScript スキル_javascript スキル
JavaScript の成功は広く話題になっており、Web ページの JavaScript コードを記述することは、すべての Web デザイナーにとっての基本的なスキルとなっています。この興味深い言語には、長年の経験を持つ JavaScript プログラマーですら完全に理解していないことが数多くあります。この記事では、あまり馴染みのない、しかし非常に実践的な JavaScript のテクニックを 7 つの側面から説明します。
省略されたステートメント
JavaScript では、次のコードのような省略されたステートメントを使用してオブジェクトと配列を迅速に作成できます:
var car = new Object();
car.colour = 'red';
car.wheels = 4 ;
car .hubcaps = 'spinning';
car.age = 4;
var car = {
colour:'red',
wheels:4,
hubcaps:'spinning',
age:4
}
オブジェクトの車が作成されますが、その前に「;」を追加しないように注意してください。そうしないと、IE で大きな問題が発生します。
配列を作成する従来の方法は次のとおりです:
var movieThatNeedBetterWriters = new Array(
'Transformers','Transformers2','Avatar','Indiana Jones 4'
);
省略したステートメントを使用します:
var movieThatNeedBetterWriters = [
'Transformers ','Transformers2','Avatar','Indiana Jones 4'
];
配列に関するもう 1 つの質問は、連想配列のようなものが存在するかどうかです。この例のように、上記の車を定義するコード例がたくさんあります。
var car = new Array();
car['colour'] = 'red';
car['wheels'] = 4; = 'spinning' ;
car['age'] = 4;
省略されたステートメントを使用できるもう 1 つの場所は、
if(x < 200){
direction = 1;
} else {
direction =
}
JSON データ形式
JSON は、Douglas Crockford によって設計された「JavaScript Object Notation」の略称です。JSON は、次の例のように、複雑なデータ形式をキャッシュする際の JavaScript のジレンマを変更します。バンドを記述したい場合は、次のように記述できます。
"name":"レッド・ホット・チリ・ペッパーズ",
"メンバー":[
{
"名前":"アンソニー・キーディス",
"役割":"リード・ボーカル"
},
{
"name":"マイケル 'フリー' バルザリー",
"役割":"ベースギター、トランペット、バッキング ボーカル"
},
{
"名前":"チャドスミス",
"role":"ドラム、パーカッション"
},
{
"name":"ジョン・フルシアンテ",
"role":"リードギター"
}
],
"year":"2009"
}
JSON は、一部の API の戻りデータ オブジェクトとしても、JavaScript で直接使用できます。次のコードは、有名なブックマーク Web サイト「delicious.com」の API を呼び出し、この Web サイトのすべてのブックマークを返し、自分の Web サイトに表示します。
<script> <br>function fresh(o){ <br>var out = '<ul>'; for(var i=0;i<o.length>out = '<li><a href="' o[i].u '">' ].d '</a></li>'; <br>} <br>out = '</ul>'; <BR>document.getElementById('delicious').innerHTML = out; 🎜>} <BR></script>
JavaScript ネイティブ関数 (Math、Array、String)
max =numbers[i];
}
alert(max); これは、 build を使用すると簡単に実現できます。 -in 関数:
コードをコピー
コードは次のとおりです: Math.max() メソッドを使用するには:
コードをコピー
コードは次のとおりです:
コードをコピーします
コードは次のとおりです:
JavaScript の組み込みの split() 関数と join() 関数を使用して、HTML オブジェクトの CSS クラス名を処理することもできます。HTML オブジェクトのクラス名がスペースで区切られた複数の名前である場合は、追加または削除します。オブジェクトにクラス名属性がない場合は、そのクラス名にスペースを入れる必要があります。これは、従来の JavaScript メソッドを使用して実装される方法です。
コードは次のとおりです。
コードをコピー
コードは次のとおりです。
HTML ドキュメント内で多数のイベントを設計する代わりに、たとえば、いくつかのリンクがある場合、ユーザーはリンクをクリックした後にイベントを実行する必要はありません。
コードをコピーします
コードは次のとおりです:
優れた Web リソース
従来のイベント処理では、各リンクをたどって独自のイベント処理を追加します。
var links = resource .getElementsByTagName ('a');
var all = links.length;
for(var i=0;i
links [i ].addEventListener('click',handler,false);
function handler(e){
var x = e.target; // クリックされたリンクを取得します。 alert( x);
e.preventDefault();
})();
イベント プロキシを使用すると、
e.preventDefault()
} ;
}) ();
匿名関数とモジュール モード
JavaScript の問題は、関数内で定義されていない限り、変数、関数、またはオブジェクトがグローバルであることです。つまり、同じページ上の他のコードがこの変数にアクセスして上書きすることができます (ECMA の JavaScript 5 ではこの状況が変わりました - トランスレータ)。匿名関数を使用すると、この問題を回避できます。
たとえば、次のようなコードがある場合、明らかに変数名、年齢、ステータスがグローバル変数になります
コードは次のとおりです:
にこの問題を回避するには、匿名関数を使用します:
コードをコピー
}();
関数は呼び出されません。より直接的に行うことができます。 コードをコピーします:
コードは次のとおりです:
(function(){
})(); >内部のオブジェクトまたは関数にアクセスしたい場合は、次のことができます:
コードをコピー
コードは次のとおりです:
var myApplication = function(){
var age = 'single';
return{ >createMember:function(){
これはいわゆるモジュール パターンまたはシングルトン パターンで、Douglas Crockford によって推奨され、Yahoo ユーザー インターフェイス ライブラリ YUI で広く使用されています。
内部のメソッドを別の場所で呼び出したいが、呼び出しの前にオブジェクト名 myApplication を使用したくない場合は、これらのメソッドを匿名関数で返すことも、省略形を使用して返すこともできます:
var myApplication = function(){
var name = 'クリス';
var age = '34';
var status = 'single';
function createMember(){
// [...]
}
function getMemberDetails (){
// [...]
}
return{
create:createMember,
get:getMemberDetails
}
}(); /myApplication.get() と myApplication .create() が機能するようになりました。
あなたが作成した JavaScript コードを他の人が使用する場合、コードの一部が変更されることは避けられません。しかし、誰もがそれを得意とするわけではないので、これは難しいでしょう。これを行う代わりに、コード構成オブジェクトを作成する方が簡単です。他の人は、このオブジェクトの特定の構成を変更するだけで済みます。変化します。これは
JavaScript 構成オブジェクトの詳細な説明 の記事です。 ・コード内でconfigurationというオブジェクトを作成します
・CSS ID とクラス名、ボタンのラベルのテキスト、説明テキスト、ローカライズされた言語設定など、変更可能なすべての設定が保存されます
・他の人が直接アクセスして変更できるように、オブジェクトをグローバル オブジェクトとして設定します
これは最後のステップとして実行する必要があります。貴重な参考資料として、
コードを出荷する前に行う 5 つのこと の記事を参照してください。 バックエンドとの対話
JavaScript はフロントエンド言語です。AJAX を使用すると、JavaScript がバックエンドと直接対話してデータを返すことができます。複雑なデータ処理はバックグラウンドで処理されます。
JavaScript フレームワーク
さまざまなブラウザーに適応する独自のコードを記述するのは完全に時間の無駄です。JavaScript フレームワークを選択し、そのフレームワークにこれらの複雑な処理を任せるべきです。
その他のリソース
Douglas Crockford による JavaScript について JavaScript の詳細なビデオ チュートリアル
Opera Web 標準カリキュラム JavaScript の詳細説明
・·
新しい API は、JavaScript がローカル ファイル上で動作できるようにすることを目指しています
·JavaScript で HTML5 オフライン ストレージを保存できるようにします
·オープンソース プロジェクトでは JavaScript がますます好まれています
・・・Google がランク付けした最も有名な JavaScript ライブラリ 10 選
・この記事の国際的な出典: Smashing MagazineSeven JavaScript Things I Wish I Wish I Knew much Early In My Career (原著者: Christian Heilmann)
[
ホットAIツール

Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。

Undress AI Tool
脱衣画像を無料で

Clothoff.io
AI衣類リムーバー

Video Face Swap
完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

人気の記事

ホットツール

メモ帳++7.3.1
使いやすく無料のコードエディター

SublimeText3 中国語版
中国語版、とても使いやすい

ゼンドスタジオ 13.0.1
強力な PHP 統合開発環境

ドリームウィーバー CS6
ビジュアル Web 開発ツール

SublimeText3 Mac版
神レベルのコード編集ソフト(SublimeText3)

ホットトピック









Win11 のヒントの共有: Microsoft アカウントのログインをスキップする 1 つのトリック Windows 11 は、新しいデザイン スタイルと多くの実用的な機能を備えた、Microsoft によって発売された最新のオペレーティング システムです。ただし、一部のユーザーにとっては、システムを起動するたびに Microsoft アカウントにログインしなければならないのが少し煩わしい場合があります。あなたがそのような人であれば、次のヒントを試してみるとよいでしょう。これにより、Microsoft アカウントでのログインをスキップして、デスクトップ インターフェイスに直接入ることができるようになります。まず、Microsoft アカウントの代わりにログインするためのローカル アカウントをシステムに作成する必要があります。これを行う利点は、

C 言語では、他の変数のアドレスを格納するポインタを表し、& は変数のメモリ アドレスを返すアドレス演算子を表します。ポインタの使用に関するヒントには、ポインタの定義、ポインタの逆参照、ポインタが有効なアドレスを指していることの確認が含まれます。アドレス演算子の使用に関するヒントには、変数アドレスの取得、配列要素のアドレスを取得するときに配列の最初の要素のアドレスを返すことなどが含まれます。 。ポインター演算子とアドレス演算子を使用して文字列を反転する実際の例。

私たちは Excel で表を作成したり編集したりすることがよくありますが、ソフトウェアに触れたばかりの初心者にとって、Excel を使用して表を作成する方法は私たちほど簡単ではありません。以下では、初心者、つまり初心者がマスターする必要があるテーブル作成のいくつかの手順について演習を行います。初心者向けのサンプルフォームを以下に示します。入力方法を見てみましょう。 1. Excel ドキュメントを新規作成するには 2 つの方法があります。 [デスクトップ]-[新規作成]-[xls]ファイル上の何もない場所でマウスを右クリックします。 [スタート]-[すべてのプログラム]-[Microsoft Office]-[Microsoft Excel 20**] を実行することもできます。 2. 新しい ex ファイルをダブルクリックします。

VSCode (Visual Studio Code) は、Microsoft によって開発されたオープン ソース コード エディターであり、強力な機能と豊富なプラグイン サポートを備えており、開発者にとって推奨されるツールの 1 つです。この記事では、初心者が VSCode の使用スキルをすぐに習得できるようにするための入門ガイドを提供します。この記事では、VSCode のインストール方法、基本的な編集操作、ショートカット キー、プラグインのインストールなどを紹介し、具体的なコード例を読者に提供します。 1. まず VSCode をインストールします。

タイトル: PHP プログラミングのヒント: 3 秒以内に Web ページにジャンプする方法 Web 開発では、一定時間内に別のページに自動的にジャンプする必要がある状況によく遭遇します。この記事では、PHP を使用して 3 秒以内にページにジャンプするプログラミング手法を実装する方法と、具体的なコード例を紹介します。まず、ページ ジャンプの基本原理は、HTTP 応答ヘッダーの Location フィールドを通じて実現されます。このフィールドを設定すると、ブラウザは指定されたページに自動的にジャンプできます。以下は、P の使用方法を示す簡単な例です。

Win11 のトリックが明らかに: Microsoft アカウントのログインをバイパスする方法 最近、Microsoft は新しいオペレーティング システム Windows11 を発表し、広く注目を集めています。以前のバージョンと比較して、Windows 11 はインターフェイスのデザインや機能の改善の点で多くの新しい調整を加えましたが、いくつかの議論も引き起こしました. 最も目を引く点は、ユーザーが Microsoft アカウントでシステムにログインすることを強制することです。ユーザーによっては、ローカル アカウントでログインすることに慣れており、個人情報を Microsoft アカウントにバインドすることに抵抗がある場合があります。

フォームは、Web サイトまたはアプリケーションの作成に不可欠な部分です。 Laravel は人気のある PHP フレームワークとして、豊富で強力なフォーム クラスを提供し、フォーム処理をより簡単かつ効率的にします。この記事では、Laravel フォームクラスを使用して開発効率を向上させるためのヒントをいくつか紹介します。以下、具体的なコード例を挙げて詳しく説明します。フォームの作成 Laravel でフォームを作成するには、まずビューに対応する HTML フォームを記述する必要があります。フォームを操作するときは、Laravel を使用できます

Go言語プログラム開発において、関数再構築スキルは非常に重要な部分です。関数の最適化とリファクタリングにより、コードの品質と保守性が向上するだけでなく、プログラムのパフォーマンスと可読性も向上します。この記事では、読者がこれらの手法をよりよく理解して適用できるように、Go 言語での関数再構築手法を具体的なコード例と組み合わせて詳しく説明します。 1. コード例 1: 重複したコード部分を抽出する 実際の開発では、コード部分が再利用されることがよくありますが、このとき、重複するコード部分を独立した機能として抽出することを検討できます。
