ホームページ > ウェブフロントエンド > jsチュートリアル > JavaScript 7つのスキル(2)_JavaScriptスキル

JavaScript 7つのスキル(2)_JavaScriptスキル

WBOY
リリース: 2016-05-16 15:25:48
オリジナル
1154 人が閲覧しました

前回の記事では 7 つの JavaScript スキル (2) 私は長い間 JavaScript コードを書いてきましたが、いつ書き始めたかさえ思い出せません。私は JavaScript がここ数年で達成したことに非常に興奮しています。私は幸運にもこれらの成果の恩恵を受けることができました。私はこの言語に特化した記事、章、本をかなりの数書いてきましたが、まだこの言語について新しいことを発見しています。以下は、私が過去に「ああ!」と思ったプログラミング テクニック、将来遭遇するのを待つのではなく、今すぐ試してみるべきテクニックについて説明します。

var band = {
   "name":"The Red Hot Chili Peppers",
   "members":[
   {
   "name":"Anthony Kiedis",
   "role":"lead vocals"
   },
   {
   "name":"Michael 'Flea' Balzary",
   "role":"bass guitar, trumpet, backing vocals"
   },
   {
   "name":"Chad Smith",
   "role":"drums,percussion"
   },
   {
   "name":"John Frusciante",
   "role":"Lead Guitar"
   }
   ],
   "year":""
   }
ログイン後にコピー

JSON は JavaScript で直接使用したり、関数にカプセル化したり、API の戻り値として使用したりできます。これを JSON-P と呼び、多くの API がこの形式を使用します。データプロバイダーを呼び出して、スクリプトコードで直接 JSON-P データを返すことができます:

01
12

Delicious Web サイトが提供する Web サービス関数を呼び出し、最近の順序付けされていないブックマークのリストを JSON 形式で取得します。

基本的に、JSON は複雑なデータ構造を記述する最も移植可能な方法であり、ブラウザーで実行できます。

json_decode() 関数を使用して PHP で実行することもできます。

JavaScript の組み込み関数 (Math、Array、String)

私が驚いたことの 1 つは、JavaScript の数学関数と String 関数を研究したときに、これらの関数によってプログラミング作業が大幅に簡素化されることがわかったことです。

これらを利用することで、複雑なループ処理や条件判定を省くことができます。

たとえば、数値の配列内の最大の数値を見つける関数を実装する必要がある場合、以前は次のようなループを作成していました。

 var numbers =
  [,,,,];
   var max = ;
   for(var i=;i
   if(numbers[i]
  > max){
   max = numbers[i];
   }
   }
   alert(max);
ログイン後にコピー

これはループせずに実現できます:

 var numbers =

  [,,,,];
   numbers.sort(function(a,b){return b -
  a});
   alert(numbers[]);
ログイン後にコピー

数字の配列を sort() することはできないことに注意してください。この場合、アルファベット順でのみソートされるからです。
さらに詳しい使用法を知りたい場合は、sort() に関するこの優れた記事を読んでください。

もう 1 つの興味深い関数は Math.max() です。

この関数は、パラメーター内の数値の中で最大の数値を返します:

Math.max(12,123,3,2,433,4); // returns 433 
ログイン後にコピー

この関数は数値をチェックして最大の数値を返すため、これを使用してブラウザーの機能のサポートをテストできます。

 var scrollTop=
  Math.max(
   doc.documentElement.scrollTop,
   doc.body.scrollTop
   );
ログイン後にコピー

これは IE の問題を解決するために使用されます。現在のページのscrollTop値を取得できますが、ページのDOCTYPEに応じて、上記の2つのプロパティのうちの1つだけがこの値を保存し、もう1つのプロパティは未定義になるため、Math.maxを使用してこれを取得できます。 () 番号。

この記事を読むと、JavaScript を簡略化するための数学関数の使用についてさらに知識が得られます。

文字列を操作するための非常に便利な関数のもう 1 つのペアは、split() と join() です。最も代表的な例は、ページ要素に CSS スタイルを付加する関数を記述することだと思います。

これは、CSS クラスをページ要素に付加する場合、この要素の最初の CSS クラスであるか、既存のクラスの後にスペースを追加する必要があります。次に、このクラスを追加します。このクラスを削除する場合は、クラスの前のスペースも削除する必要があります (これは以前は非常に重要でした。一部の古いブラウザでは、スペースに続くクラスが認識されなかったためです)。

つまり、元の文章は次のようになります:

 function addclass(elm,newclass){
   var c =
  elm.className;
   elm.className = (c === '') ? newclass : c+' '+newclass;
   }  你可以使用 split() 和 join() 函数自动完成这个任务: function addclass(elm,newclass){
   var classes =
  elm.className.split(' ');
   classes.push(newclass);
   elm.className = classes.join(' ');
   }  
ログイン後にコピー

これにより、すべてのクラスがスペースで区切られ、追加するクラスが最後に配置されます。

これは近視眼的な行動です。ツールキットは迅速な開発に役立ちますが、JavaScript を深く理解していないと、間違った作業をしてしまう可能性もあります。

JSON 形式でデータを保存する

JSON を発見する前は、配列、文​​字列などの JavaScript のネイティブ データ型にデータを保存するために、あらゆる種類のクレイジーな方法を使用し、分割しやすい記号やその他のわかりにくい厄介なものを混ぜていました。

Douglas Crockford が JSON を発明してから、すべてが変わりました。

JSON を使用すると、JavaScript 独自の関数を使用してデータを複雑な形式で保存でき、追加の変換を行わずに直接アクセスして使用できます。

JSON は「JavaScript Object Notation」の略称であり、上記の 2 つの略称方法が使用されます。

上記の内容は、編集者が皆さんに共有した 7 つの JavaScript スキルです。気に入っていただければ幸いです。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート