ホームページ  >  記事  >  ウェブフロントエンド  >  コーディング効率を向上させるための js 構文の一般的な 10 の方法をまとめます

コーディング効率を向上させるための js 構文の一般的な 10 の方法をまとめます

零下一度
零下一度オリジナル
2017-05-17 18:01:321627ブラウズ

はじめに

仕事や生活の変化により、最近記事を書く頻度が少し落ちてしまいましたが、近いうちに少しずつ回復すると信じておりますので、今後ともよろしくお願いいたします。そしてサポートします。

この記事では、主に JavaScript コードを作成する際のいくつかの方法とテクニックを紹介しますが、すべての道はローマに通じている場合もありますが、常に最短の道が存在する可能性があります。以下の JavaScript スキルを通じて、皆さんのコードが「複雑化・簡略化、簡素化・洗練化」されることを願っています。

上手に学んで使いましょう

1. new Set()

Set が ES6 で提供された新しいデータ構造であることは知っている人もいるかもしれませんが、柔軟に使いこなせる人は多くありません。 Set データ構造を使用すると、

let arr = [1, 2, 2, 3];
let set = new Set(arr);
let newArr = Array.from(set); // Array.from方法可以将 Set 结构转为数组。

console.log(newArr); // [1, 2, 3]
などの

array

を簡単に重複排除できます。 Object.assign()

Object.assign() は、ES6 で提供されるオブジェクトの拡張メソッドでもあり、以下に使用できます。オブジェクトのマージコピー (例:

let obj1 = {a: 1};
let obj2 = {b: 2};
let obj3 = Object.assign({}, obj1, obj2);

console.log(obj3); // {a: 1, b: 2}

3)。map()

map メソッドは、配列の各項目を操作して新しい配列を生成するために使用されます。 for ループと forEach ループを置き換えて、次のようにコードを簡素化できます。

filter メソッドは、名前が示すように、配列をフィルタリングして

をトリガーします。各要素の後にコールバック関数

を呼び出して、現在の項目を保持または削除し、最後に、

let arr3 = [1, 2, 3, 4, 5];

let newArr3 = arr3.map((e, i) => e * 10); // 给数组每一项乘以10

console.log(newArr3); // [10, 20, 30, 40, 50]
5 などの新しい配列を返します。some()

some メソッドを使用して配列を走査し、コールバックをトリガーします。各要素の後に関数を実行し、条件を満たしている限り true を返します。それ以外の場合は、|| 比較と同様に false を返します。例:

let arr4 = [1, 2, 3, 4, 5];

let newArr4 = arr4.filter((e, i) => e % 2 === 0); // 取模,过滤余数不为0的数

console.log(newArr4); // [2,4]

6.every()

すべてのメソッドが配列を走査するために使用され、トリガーされます。各要素の後にコールバック関数があり、条件を満たさない限り false を返します。それ以外の場合は、 && 比較と同様に true を返します。例:

let arr5 = [{result: true}, {result: false}];

let newArr5 = arr5.some((e, i) => e.result); // 只要一个为true,即为true

console.log(newArr5); // true

7 記号 ~~

operator

~ が使用されます。 JavaScript でビット単位の反転を実行するには、~~ は 2 回の反転を意味し、

ビット単位の演算

演算値は 整数 である必要があり、結果も整数であるため、ビット単位の演算は自動的に整数になります。

let arr6 = [{result: true}, {result: false}];

let newArr6 = arr6.every((e, i) => e.result); // 只要一个为false,即为false

console.log(newArr6); // false
8 のように、parseInt と同様に、この部分を賢く削除できます。 || 演算子

は賢いです。 || 演算子を使用すると、

let a = 1.23;
let b = -1.23;

console.log(~~a); // 1
console.log(~~b); // -1

9 のように、変数 のデフォルト値を設定できます。 ...演算子

...演算子は ES6 で配列を分解するために使用されるメソッドであり、

let c = 1;
let d = c || 2; // 如果c的值为true则取存在的值,否则为2

console.log(d); // 1

10 のような配列パラメータを迅速に取得するために使用できます。

三項演算

演算子この演算子は次のようになります。ディクテーションの場合、次のような if else の記述を簡素化できます。

let [num1, ...nums] = [1, 2, 3];

console.log(num1); // 1
console.log(nums); // [2, 3]

結論

この記事では、

JavaScript 構文

の中で、コーディング効率を向上させる 10 の一般的な方法を簡単に説明します。もちろん、それぞれの知識を拡張し、探究することもできますので、皆さんも上手に学び、同時に使いこなしていただければと思います。 【関連する推奨事項】


1.

特別な推奨事項: 「php Programmer Toolbox」V0.1バージョンのダウンロード2.

3 php.cn Dugu Jiijian (3) - JavaScript ビデオ チュートリアル

以上がコーディング効率を向上させるための js 構文の一般的な 10 の方法をまとめますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。