[2弾]コールバック関数の抽出

45092 ワード

テキストリンク

6.1抽出関数
コード・セグメントを見つけて、何をしているのかを理解し、独立した関数として抽出し、名前を付けます.

1つの関数が1つの画面を超えた場合

2回以上使用する場合

目標と実施の分離

コードを見て何をしているのかを理解するのに時間がかかる場合は、関数として抽出します.

この何をするのに適した人を呼ぶ.
(長関数の各コードの先頭にコメントがあります.名前を付けるときはコメントを参照してください!)

💁 関数抽出プロセス

関数を再作成し、名前を付けて目的を強調します.△「どうするか」ではなく、「何をするか」です.
コードが関数呼び出し文のように簡単な場合は、関数として抽出し、より明確な名前を付けることもできます.抽出中に良い名前が出る可能性があるので、最初から最高の名前を取る必要はありません.

抽出するコードをソース関数からコピーして新しい関数に貼り付けます.

抽出されたコードに元の関数を参照する領域変数または抽出関数の有効範囲を超えた変数があるかどうかを確認します.ある場合はパラメータとして渡されます.
→元の関数の重ね合わせ関数を抽出しても問題は発生しません.
→抽出されたコードでのみ使用される変数宣言が抽出された関数の外にある場合は、抽出された関数で宣言するように変更
→抽出したコードでは,変換値の変数で値に渡されるものを扱うことに注意する.

変数が処理されたら、コンパイルします.
→コンパイル言語で開発している場合は、すべての変数を処理してから、もう一度コンパイルします.

ソース関数から抽出されたコード部分を、新しい関数を呼び出す文に置き換えます(つまり、抽出された関数に作業を委任します).

テスト.

他のコードに、先ほど抽出したコードと同じまたは類似のコードがあるかどうかを確認します.ある場合は、さっき抽出した新しい関数を呼び出すように変更したかどうかを確認します.

//예시

function printOwing(invoice){
	let outstanding = 0;
	
	console.log("***************");
	console.log("*****고객 채무*****");
	console.log("***************");

	for (const o of invoice.orders){
		outstanding += o.amount;
	}

	//마감일(dueDate)을 기록한다.
	const today = Clock.today;
	invoice.dueDate = new Date(today.getFullYear(), today.getMonth(),
														 today.getDate() + 30);
	//세부 사항을 출력한다.
	console.log(`고객명 : ${invoice.customer}`);
	console.log(`채무액 : ${outstanding}`);
	console.log(`마감일 : ${invoice.dueDate.toLocaleDateString()}`);
}

バナー関数の抽出


//예시

function printOwing(invoice){
	let outstanding = 0;

	printBanner();
	
 	for (const o of invoice.orders){
		outstanding += o.amount;
	}

	//마감일(dueDate)을 기록한다.
	const today = Clock.today;
	invoice.dueDate = new Date(today.getFullYear(), today.getMonth(),
														 today.getDate() + 30);
	//세부 사항을 출력한다.
	console.log(`고객명 : ${invoice.customer}`);
	console.log(`채무액 : ${outstanding}`);
	console.log(`마감일 : ${invoice.dueDate.toLocaleDateString()}`);
}

function printBanner(){
	console.log("***************");
	console.log("*****고객 채무*****");
	console.log("***************");
}

詳細出力コードの抽出


//예시

function printOwing(invoice){
	let outstanding = 0;

	printBanner();
	
 	for (const o of invoice.orders){
		outstanding += o.amount;
	}

	//마감일(dueDate)을 기록한다.
	const today = Clock.today;
	invoice.dueDate = new Date(today.getFullYear(), today.getMonth(), today.getDate() + 30);
	
	//세부 사항을 출력한다.
	printDetails();
}

function printBanner(){
	console.log("***************");
	console.log("*****고객 채무*****");
	console.log("***************");
}

**function printDetails(){
	console.log(`고객명 : ${invoice.customer}`);
	console.log(`채무액 : ${outstanding}`);
	console.log(`마감일 : ${invoice.dueDate.toLocaleDateString()}`);
}**

ゾーン変数を使用する場合

地域変数の場合、最も簡単な場合は変数を使用しますが、他の値は再代入されません.

であれば,地域変数をパラメータとして渡すだけでよい.


//예시

function printOwing(invoice){
	let outstanding = 0;

	printBanner();
	
	//미해결 채무 outstanding 계산
 	for (const o of invoice.orders){
		outstanding += o.amount;
	}

	//마감일(dueDate)을 기록한다.
	const today = Clock.today;
	invoice.dueDate = new Date(today.getFullYear(), today.getMonth(), today.getDate() + 30);
	
	//세부 사항을 출력한다.
	printDetails(invoice, outstanding);

function printBanner(){
	console.log("***************");
	console.log("*****고객 채무*****");
	console.log("***************");
}
	
function printDetails(invoice, outstanding){
	console.log(`고객명 : ${invoice.customer}`);
	console.log(`채무액 : ${outstanding}`);
	console.log(`마감일 : ${invoice.dueDate.toLocaleDateString()}`);
}

領域変数が(配列、レコード、オブジェクトなど)データ構造である場合、パラメータに渡される値も同様に変更できます.


//예시

function printOwing(invoice){
	let outstanding = 0;

	printBanner();
	
	//미해결 채무 outstanding 계산
 	for (const o of invoice.orders){
		outstanding += o.amount;
	}
	
	recordDueDate(invoice);
	printDetails(invoice, outstanding);

function printBanner(){
	console.log("***************");
	console.log("*****고객 채무*****");
	console.log("***************");
}

function recordDueDate(invoice){
	const today = Clock.today;
	invoice.dueDate = new Date(today.getFullYear(), today.getMonth(), today.getDate() + 30));
}
function printDetails(invoice, outstanding){
	console.log(`고객명 : ${invoice.customer}`);
	console.log(`채무액 : ${outstanding}`);
	console.log(`마감일 : ${invoice.dueDate.toLocaleDateString()}`);
}

ゾーン変数の値を変更する場合


//예시

function printOwing(invoice){

	printBanner();
	
	//미해결 채무 outstanding 계산
	let outstanding = 0; //맨 위에 있던 선언문을 이 위치로 이동

 	for (const o of invoice.orders){
		outstanding += o.amount;
	}
	
	recordDueDate(invoice);
	printDetails(invoice, outstanding);
}

次に、抽出する部分を新しい関数にコピーします.

function calculateOutstanding(invoice){
	let outstanding = 0;
	for (const o of invoice.orders){
		outstanding += o.amount;
	}
	return outstanding
}

保存

戻り値周期

function printOwing(invoice){

	printBanner();
  
	//미해결 채무 outstanding 계산
	let outstanding = calculateOutstanding(invoice); //맨 위에 있던 선언문을 이 위치로 이동
	recordDueDate(invoice);
	printDetails(invoice, outstanding);

	function calculateOutstanding(invoice){
		let outstanding = 0;
		for (const o of invoice.orders){
			outstanding += o.amount;
		}
		return outstanding
	}
}

最後に戻り値の名前を私に適した符号化スタイル

に変更しました.

function printOwing(invoice){

	printBanner();
	const outstanding = calculateOutstanding(invoice);
	recordDueDate(invoice);
	printDetails(invoice, outstanding);
}

///////////////////////////////////////////////////////////////////////////

function calculateOutstanding(invoice){
	let result = 0;
	for (const o of invoice.orders){
		result += o.amount;
	}
	return result;
}

function printBanner(){
	console.log("***************");
	console.log("*****고객 채무*****");
	console.log("***************");
}

function recordDueDate(invoice){
	const today = Clock.today;
	invoice.dueDate = new Date(today.getFullYear(), today.getMonth(), today.getDate() + 30);
}![](https://media.vlpt.us/images/hoon2hooni/post/ed4eec15-49a7-4511-a4cb-642fecdbdef8/%EB%A6%AC%ED%8C%A9%ED%84%B0%EB%A7%81%EC%B1%85.jpg)

function printDetails(invoice, outstanding){
	console.log(`고객명 : ${invoice.customer}`);
	console.log(`채무액 : ${outstanding}`);
	console.log(`마감일 : ${invoice.dueDate.toLocaleDateString()}`);
}

reference

2 2版コード構造を再包装し、効率的な再包装を実現するためにシステムの改良を行った[『再包装』改訂版]マーティン・パラージャー/犬正面、南起赫駅|2020年04月01日

Reference

この問題について([2弾]コールバック関数の抽出), 我々は、より多くの情報をここで見つけました https://velog.io/@hoon2hooni/2탄-리팩터링-함수-추출하기

テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。

Collection and Share based on the CC Protocol

マイクロソフトExcelでVBAを使っているモジュールに手順を加える方法?

[プログラマー]Summer/Winter Coding(~218)>小数点の作成