JavaScriptノート02(jsループ/関数パラメータ/jsで値/検出タイプ/配列共通apiをコピー)
8466 ワード
JavaScriptノート02
ノートを受け取る
5.for/forEach/for-in/for-of
bbは多くありません.コードを直接見ます.
ただし、for-ofは配列やオブジェクトのほか、string文字列やES 6に追加されたMap、Setのセットを巡回することもできます.もっと詳しくはこの文章を参考にすることができます.まとめると、ループ配列はbreakやreturnがforEachを推奨する必要はなく、必要であればfor-ofを使用し、通常のオブジェクトをループしてfor-inを使用し、残りはfor-ofを使用します.もちろん、最も重要なのは彼らの異同を理解し、使用するときに柔軟に選択することです.
6.関数パラメータについて jsの関数は、パラメータの個数も、パラメータのタイプも気にしない jsのパラメータは、実際には配列 です.
上記2点については、以下のコードを参照してください.
関数のパラメータを削除します
結果は同じです.
argumentsという特性を利用して加数を規定しない加算を書くことができます
argumentsは実際にはarrayのインスタンスではなくarrayオブジェクトであることに注意してください.
7.基本タイプと参照タイプで値をコピーする場合の違い
この点は主に参照タイプを理解するためのポインタです基本タイプの値をコピーすると、変数オブジェクトに新しい値が作成され、この新しい値が新しい変数割り当ての場所にコピーされます. 参照タイプの値をコピーすると、コピーされるのはポインタです.ポインタは異なりますが、ポインタは同じオブジェクトを指しているので、1つの参照タイプがオブジェクトを変更すると、別の参照タイプの値も変化します.
8.検出タイプ
typeofについてはノート1の4点目に明記されているが、typeofは主に基本データ型を検出するために用いられ、検出された値が1つのオブジェクトまたはnullであれば
9.配列共通API
方法
さぎょう
戻り値
push()
任意の数のパラメータを配列の末尾に追加
修正後の配列の長さ
pop()
配列の最後から最後の項目を削除
削除されたアイテム
shift()
配列の最初の項目を削除
削除されたアイテム
unshift()
数値フロントエンドに任意の数のパラメータを追加
修正後の配列の長さ
reverse()
配列アイテムの順序を反転
反転配列
sort()
並べ替え、デフォルトは基本的に使わず、書き換える必要があります
ソート後の配列
concat()
現在の配列に基づいて新しい配列を作成
新しい配列
splice()
削除:
元の配列から削除されたアイテムからなる配列
挿入:
元の配列から削除されたアイテムからなる配列
置換:
元の配列から削除されたアイテムからなる配列
indexOf()/lastIndexOf()
配列の先頭/末尾からn番目のビットにあるアイテムを検索
検索されたアイテム
every()
配列内の各項目に対して所定の関数を実行する
各項目がtrueを返すとtrueが返されます
filter()
配列内の各項目に対して所定の関数を実行する
この配列のtrueを返すすべてのアイテムからなる新しい配列を返します.
forEach()
配列内の各項目に対して所定の関数を実行する
戻り値はありません.このメソッドは主に配列を巡回するために使用されます.
map()
配列内の各項目に対して所定の関数を実行する
各関数呼び出しの結果からなる配列
some()
配列内の各項目に対して所定の関数を実行する
trueを返すアイテムが1つある場合はtrueを返します.
reduce()/reduceRight()
集計方法は、次の例を見てみましょう
例をみる
sortメソッドの書き換え
反復メソッド
reduce()
10.calleeについて(厳密モードではエラー)
関数の内部にはargumentsとthisの2つの特殊なオブジェクトがあります.calleeはargumentsのプロパティです.
まず、非常に古典的な階乗関数を見てみましょう.
しかし、このように問題があり、関数の実行と関数名
これにより、関数名を変更しても影響はありません.注意callerと区別します.
11.関数のapply()、call()およびbind()メソッド
役割:このメソッドは、
12.具体的な桁数の小数処理
自分の仕事の中でちょうど出会って、要求は四捨五入して小数点の後の1位を取ることです.私はこう書きました.
今日本を読むと既成の方法があります.
もっと簡単なようですが、データ型は変わりました.だから本の中でもNumberタイプをインスタンス化しないことをお勧めします.もちろん、私が仕事で使っているシーンを見ても、実は
ノートを受け取る
5.for/forEach/for-in/for-of
bbは多くありません.コードを直接見ます.
//
let array = ['a', 'b', 'c'];
// for
for (let index = 0; index < array.length; index++) {
const element = array[index];
console.log(element);
}
// forEach
// break , return
array.forEach(element => {
console.log(element);
});
// for-in
// , index , ,
//
for(const index in array) {
console.log(typeof index);
console.log(array[index]);
}
// for-of
// 、
// for-in
// forEach() , break、continue return
for (const value of array) {
console.log(value);
}
//
let me = {
name: 'ethan',
sex: 'male',
age: 24,
hobby: 'skate'
};
// for-in
for (const key in me) {
//
if (me.hasOwnProperty(key)) {
console.log(key+ ':' + me[key]);
}
}
// for-of , , for-in
for (const key of Object.keys(me)) {
console.log(key+ ':' + me[key]);
}
ただし、for-ofは配列やオブジェクトのほか、string文字列やES 6に追加されたMap、Setのセットを巡回することもできます.もっと詳しくはこの文章を参考にすることができます.まとめると、ループ配列はbreakやreturnがforEachを推奨する必要はなく、必要であればfor-ofを使用し、通常のオブジェクトをループしてfor-inを使用し、残りはfor-ofを使用します.もちろん、最も重要なのは彼らの異同を理解し、使用するときに柔軟に選択することです.
6.関数パラメータについて
上記2点については、以下のコードを参照してください.
function abc (a, b) {
console.log(arguments[0]);
console.log(arguments.length);
}
abc(1); // 1 1
abc(1,2); // 1 2
abc(); // undefined 0
関数のパラメータを削除します
function abc () {
console.log(arguments[0]);
console.log(arguments.length);
}
abc(1); // 1 1
abc(1,2); // 1 2
abc(); // undefined 0
結果は同じです.
argumentsという特性を利用して加数を規定しない加算を書くことができます
function add() {
if(arguments.length === 0){
return 0;
} else {
let total = 0;
for(let i = 0; i < arguments.length; i++) {
if (typeof arguments[i] === 'number') {
total += arguments[i];
}
}
return total;
}
}
console.log(add(1, 3, 5.5, 7, 8, 'a', 10));
argumentsは実際にはarrayのインスタンスではなくarrayオブジェクトであることに注意してください.
function abc() {
console.log(arguments);
console.log(typeof arguments);
}
abc(); // {} object
abc(1); // { '0': 1 } object
abc(1,2); // { '0': 1, '1': 2 } object
7.基本タイプと参照タイプで値をコピーする場合の違い
この点は主に参照タイプを理解するためのポインタです
let num1 = 1;
let num2 = num1;
console.log(num2); // 1
num1 = 2;
console.log(num2); // 1 , , num1 num2
let person1 = {
name: 'ethan'
};
let person2 = person1;
console.log(person2.name); // ethan
person1.name = 'ethan1';
console.log(person2.name); // ethan1, , person1 person2 , 。
8.検出タイプ
typeofについてはノート1の4点目に明記されているが、typeofは主に基本データ型を検出するために用いられ、検出された値が1つのオブジェクトまたはnullであれば
object
に戻るので、変数が参照型の場合はinstanceof,person instanceof RegExp
を用いてtrue/false
に戻り、Array.isArray()
に戻るのが望ましい.配列の場合、array.splice(0,2);
も使用できます.9.配列共通API
方法
さぎょう
戻り値
push()
任意の数のパラメータを配列の末尾に追加
修正後の配列の長さ
pop()
配列の最後から最後の項目を削除
削除されたアイテム
shift()
配列の最初の項目を削除
削除されたアイテム
unshift()
数値フロントエンドに任意の数のパラメータを追加
修正後の配列の長さ
reverse()
配列アイテムの順序を反転
反転配列
sort()
並べ替え、デフォルトは基本的に使わず、書き換える必要があります
ソート後の配列
concat()
現在の配列に基づいて新しい配列を作成
新しい配列
splice()
削除:
array.splice(2,0,"red","green");
パラメータは、削除する最初の項目と削除する項目の数です.元の配列から削除されたアイテムからなる配列
挿入:
array.splice(2,1,"red","green");
2 2から0を削除し、redとgreenを挿入します.元の配列から削除されたアイテムからなる配列
置換:
factorial
前の1条を参考にして、とても分かりやすいです元の配列から削除されたアイテムからなる配列
indexOf()/lastIndexOf()
配列の先頭/末尾からn番目のビットにあるアイテムを検索
検索されたアイテム
every()
配列内の各項目に対して所定の関数を実行する
各項目がtrueを返すとtrueが返されます
filter()
配列内の各項目に対して所定の関数を実行する
この配列のtrueを返すすべてのアイテムからなる新しい配列を返します.
forEach()
配列内の各項目に対して所定の関数を実行する
戻り値はありません.このメソッドは主に配列を巡回するために使用されます.
map()
配列内の各項目に対して所定の関数を実行する
各関数呼び出しの結果からなる配列
some()
配列内の各項目に対して所定の関数を実行する
trueを返すアイテムが1つある場合はtrueを返します.
reduce()/reduceRight()
集計方法は、次の例を見てみましょう
例をみる
sortメソッドの書き換え
function compare (value1, value2) {
if(value1 < value2) {
return -1;
} else if (value1 > value2) {
return 1;
} else {
return 0;
}
}
let values = [14,2,53,3,6,1];
values.sort(compare);
console.log(values); // [ 1, 2, 3, 6, 14, 53 ]
反復メソッド
let num = [1,2,3,4,5,4,3,2,1];
// every()
let everyResult = num.every((item, index, array) => {
return (item > 2);
});
console.log(everyResult); // false
// filter()
let filterResult = num.filter((item, index, array) => {
return (item > 2)
})
console.log(filterResult); // [ 3, 4, 5, 4, 3 ]
// forEach()
num.forEach(element => {
console.log(element); // 1 2 3 4 5 4 3 2 1
});
// map()
let mapResult = num.map((item, index, array) => {
return (item*2);
})
console.log(mapResult); // [ 2, 4, 6, 8, 10, 8, 6, 4, 2 ]
// some()
let someResult = num.some((item, index, array) => {
return (item > 2);
})
console.log(someResult); // ture
reduce()
let num = [1,2,3,4,5];
let sum = num.reduce((prev, cur, index, array) => {
return prev+cur;
})
console.log(sum); // 15
10.calleeについて(厳密モードではエラー)
関数の内部にはargumentsとthisの2つの特殊なオブジェクトがあります.calleeはargumentsのプロパティです.
まず、非常に古典的な階乗関数を見てみましょう.
function factorial(num) {
if (num <= 1) {
return 1;
} else {
return num * factorial(num-1);
}
}
console.log(factorial(5)); // 120
しかし、このように問題があり、関数の実行と関数名
arguments.callee
が密接に結合されており、この問題を解決するためにapply()
を使用することができます.function factorial(num) {
if (num <= 1) {
return 1;
} else {
return num * arguments.callee(num-1);
}
}
console.log(factorial(5)); // 120
これにより、関数名を変更しても影響はありません.注意callerと区別します.
11.関数のapply()、call()およびbind()メソッド
call()
:関数を実行する役割ドメインとパラメータ配列の2つのパラメータを受け入れます.function sum (num1, num2) {
return num1 + num2;
}
function applySum1 (num1,num2,num3) {
return sum.apply(this, [num1, num3]);
}
function applySum2 (num1,num2,num3) {
return sum.apply(this, arguments);
}
console.log(applySum1(10,20,30)); // 40
console.log(applySum2(10,20,30)); // 30
apply()
:作用はapply()
と同じで、異なるのは2番目のパラメータで、配列の形式ではなく、一つ一つ列挙しなければならない.function sum (num1, num2) {
return num1 + num2;
}
function callSum1 (num1,num2,num3) {
return sum.call(this, num1, num3);
}
console.log(callSum1(10,20,30)); // 40
役割:
call()
とbind()
の最大の役割は、関数を拡張して実行できる役割ドメインです.以下のようにします.window.color = 'red';
let o = {
color: 'green'
};
function printColor () {
return this.color;
}
console.log(printColor.call(window)); // red
console.log(printColor.call(this)); // red
console.log(printColor.call(o)); // green
toFix()
関数に渡される値にバインドされる関数のインスタンスを作成します.次のようにします.let color = 'red';
let o = {
color: 'green'
};
function printColor () {
console.log(this.color);
}
let objectPrintColor = printColor.bind(o);
objectPrintColor(); // green
12.具体的な桁数の小数処理
自分の仕事の中でちょうど出会って、要求は四捨五入して小数点の後の1位を取ることです.私はこう書きました.
s = Math.round(s * 10) / 10 + 'km';
今日本を読むと既成の方法があります.
let s = 3.1415;
s1 = Math.round(s * 10) / 10;
console.log(s1); // 3.1
console.log(typeof s1); // number
s2 = s.toFixed(1);
console.log(s2); // 3.1
console.log(typeof s2); // string
もっと簡単なようですが、データ型は変わりました.だから本の中でもNumberタイプをインスタンス化しないことをお勧めします.もちろん、私が仕事で使っているシーンを見ても、実は
toFix()
を使っても影響しません.