JavaScript_javascript スキルにおける実践的なネイティブ API のまとめ

WBOY
リリース: 2016-05-16 15:59:00
オリジナル
1381 人が閲覧しました

トピックに直接移動

文字列オブジェクトを解析します

JavaScript オブジェクトを JSON にシリアル化できること、また JSON をオブジェクトに解析できることは誰もが知っていますが、問題は、JSON でもオブジェクトでもない「もの」がある場合、JSON に変換するのが不便であることです。どちらかを選択してから eval を使用すると便利です

var obj = "{a:1,b:2}";  // 看起来像对象的字符串
eval("("+ obj +")")   // {a: 1, b: 2}
ログイン後にコピー

eval は文字列式を実行でき、文字列オブジェクト obj を実際のオブジェクトに実行したいので、eval を使用する必要があります。ただし、eval がステートメントとして {} を使用して obj を実行するのを防ぐために、obj の外側に () のペアを置き、式に解析できるようにします。

& (ビット単位の AND)

数値が 2 の n 乗であるかどうかを判断するには、その数値から 1 を引いた値と AND を演算します。

var number = 4
(number & number -1) === 0 // true
ログイン後にコピー

^ (ビットごとの XOR)

異なる 3 番目の変数を使用すると、2 つの変数の値を交換できます

var a = 4,b = 3
a = a ^ b //  7
b = a ^ b //  4
a = b ^ a //  3
ログイン後にコピー

日付のフォーマット

フォーマット後の時間を取得したいですか?年、月、日、時、分、秒を取得する必要はなくなり、3 つのステップで取得できるようになりました

var temp = new Date();
var regex = /\//g;
(temp.toLocaleDateString() + ' ' + temp.toLocaleTimeString().slice(2)).replace(regex,'-');

// "2015-5-7 9:04:10"

ログイン後にコピー

フォーマットされた時刻を時刻オブジェクトに変換したいですか? Date コンストラクター

を直接使用します。
new Date("2015-5-7 9:04:10");

// Thu May 07 2015 09:04:10 GMT+0800 (CST)

ログイン後にコピー

標準時間オブジェクトを UNIX タイムスタンプに変換したいですか? valueOf でそれが完了します

(new Date).valueOf();

// 1431004132641

ログイン後にコピー

多くの友人も、これでタイムスタンプをすぐに取得できることを思い出させてくれました

新しい日付

1ドルプラス

1 ドルプラスすると、文字列数値を数学的な数値にすばやく変換できます。つまり、

var number = "23" 
typeof number // string
typeof +number // number
ログイン後にコピー

時間オブジェクトをタイムスタンプに変換できます

new Date // Tue May 12 2015 22:21:33 GMT+0800 (CST)
+new Date // 1431440459887
ログイン後にコピー

エスケープ URI

ルート内のパラメータとして URL を渡す必要がありますが、エスケープしてください

var url = encodeURIComponent('http://segmentfault.com/questions/newest')

// "http%3A%2F%2Fsegmentfault.com%2Fquestions%2Fnewest"

ログイン後にコピー

逆脱出

decodeURIComponent(url)
// "http://segmentfault.com/questions/newest"


ログイン後にコピー

番号

文字列インターセプトを行わずに小数点以下の小数点以下の桁を保持したい場合は、toFixed を使用してそれらを取り除きます

number.toFixed()   // "12346"
number.toFixed(3)  // "12345.679"
number.toFixed(6)  // "12345.678900"
ログイン後にコピー

パラメータの範囲は 0~20 で、書かれていない場合、デフォルトは 0 です

タイプ検出

Typeof は最も頻繁に使用される型検出方法です

typeof 3    // "number"
typeof "333"  // "string"
typeof false  // "boolean"

ログイン後にコピー

基本的な (単純な) データ型には適していますが、参照データ型になると、それほど簡単ではありません

typeof new Date()  // "object"
typeof []      // "object"
typeof {}      // "object"
typeof null     // "object"   

ログイン後にコピー

最初の 3 つは耐えられますが、null は実際にはオブジェクトを返します。冗談ですか! ! ! (追記: 実はこれは JavaScript のバグで、人が修正することはできません ꒰・◡・๑꒱ )

今回は、instanceof

を使用します。
toString instanceof Function
// true
(new Date) instanceof Date
// true
[] instanceof Object
// true
[] instanceof Array
// true

ログイン後にコピー

実際、[] と Object が true になることがわかります。[] もオブジェクトであることはわかっていますが、型を決定するためのより正確な方法が必要であり、それがここにあります。
Object.prototype.toString() を使用して判定します。各オブジェクトが検出を通過するには、Function.prototype.call または Function.prototype.apply を使用して

を呼び出す必要があります。
var toString = Object.prototype.toString;

toString.call(new Date)  // "[object Date]"
toString.call(new Array)  // "[object Array]"
toString.call(new Object) // "[object Object]"
toString.call(new Number) // "[object Number]"
toString.call(new String) // "[object String]"
toString.call(new Boolean) // "[object Boolean]"

ログイン後にコピー

toString メソッドはオーバーライドされる可能性が高いため、使用する必要がある場合は、
Object.prototype.toString() メソッドを直接使用できます

継承の実装

公式の例を見てください

//Shape - superclass
function Shape() {
 this.x = 0;
 this.y = 0;
}

Shape.prototype.move = function(x, y) {
  this.x += x;
  this.y += y;
  console.info("Shape moved.");
};

// Rectangle - subclass
function Rectangle() {
 Shape.call(this); //call super constructor.
}

Rectangle.prototype = Object.create(Shape.prototype);

var rect = new Rectangle();

rect instanceof Rectangle //true.
rect instanceof Shape //true.

rect.move(1, 1); //Outputs, "Shape moved."

ログイン後にコピー

呼び出しを通じて初期化されたプロパティとメソッドを取得し、Object.create を通じてプロトタイプ オブジェクトのプロパティとメソッドを取得します

反復

ES5 には、map、filter、some、every、reduce などの反復関数が多数あります。

配列

特定の API については、ここで詳しく紹介されています。
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Glob...
ここにいくつかの言葉があります:
結合、ポップ、プッシュ、リバース、シフト、ソート、スプライス、シフト解除により元の配列が変更されます

concat,indexOf,lastIndexOf,slice,toString は元の配列を変更しません

map、filter、some、every、reduce、forEach などの反復メソッドは、元の配列を変更しません

いくつかの注意点:

1 シフト、ポップは削除された要素を返します
2 splice は、削除された要素で構成される配列、または空の配列を返します
3 プッシュすると新しい配列の長さが返されます
true の場合は 4 回停止します
false がある場合はストップごとに 5 つ
6 上記の反復メソッドでは、最後にパラメーター thisArg を追加できます。これは、コールバック実行時の this 値です。

以上がこの記事の全内容です。皆さんに気に入っていただければ幸いです。

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