“ 지연되는 프로젝트에 인력을 더 투입하면 오히려 더 늦어진다. ”
728x90
오늘 배운 자바스크립트를 정리해볼 예정입니다!
자바스크립트
1. 함수 유형 : 객체리터럴 함수
{
function func(num, name, com){
this.num = num;
this.name = name;
this.com = com;
}
func.prototype = {
result1: function(){
document.write(`${this.num}. ${this.name}가 ${this.com}되었습니다.`);
},
result2: function(){
document.write(`${this.num}. ${this.name}가 ${this.com}되었습니다.`);
},
result3: function(){
document.write(`${this.num}. ${this.name}가 ${this.com}되었습니다.`);
}
}
//인스턴스
const info1 = new func("102", "함수", "실행");
const info2 = new func("202", "자바스크립트", "실행");
const info3 = new func("302", "리액트", "실행");
//실행문
info1.result1();
info2.result2();
info3.result3();
}
| 101.함수가 실행되었습니다. 201.함수가 실행되었습니다. 301.함수가 실행되었습니다. |
객체 리터럴 함수는 javascript에서 객체를 생성하는 방법중 하나로 {}안에 프로퍼터들을 정의 하여 객체를 생성하는 방법입니다. func라는 생성자 함수를 선어하여 num,name,com 세 개의 인자를 받습니다.
생성자 함수 안에 프로트 타입 객체 result1,result2,result3이라는 메서드을 선언합니다.
프로트 타입에 선언되 메서드는 객체생성시 생성자 함수에 의해 생성된 모든 객체에 대해 동일한 함수코드를 참조하게 됩니다. 프로토타입 체인을 통해 상속도 가능합니다
그 후 info1, info2, info3은 생성자 함수를 사용하면서 새로운 객체로 생성됩니다.
이 새로운 객체들은 각각 참조되어 info1.result1(), info2.result2(), info3.result3()와 같이 호출되면, 해당 메서드가 실행됩니다.
2. 함수 유형 : 즉시 실행 함수
{
// function func(){
// document.write("함수가 실행되었습니다.);
// };
// func();
(function (){
document.write("500.함수가 실행되었습니다.");
}());
//함수 실행문을 합침
(() => {
document.write("501.함수가 실행되었습니다.");
})();
//화살표 함수(페이지열자마자 나오는 실행 애니메이션)
}
| 500.함수가 실행되었습니다. 501.함수가 실행되었습니다. |
즉시 실행 함수는 함수명을 생략 할 수있어 쉽게 실행할 수있는 함수입니다.
즉시 실행 함수는 function까지 생략할 수 있어 간단하게 사용가능합니다.
3. 함수 유형 : 파라미터 함수
{
function func(str = "600.함수가 실행되었습니다."){
document.write(str);
}
func();
}
| 600.함수가 실행되었습니다. |
파라미터 함수는 매개변수를 넣는 곳에 실행하고자 하는 문자열을 함께 넣어 변수에 저장하여 매개변수를 통해 함수를 실행합니다.
4. 함수 유형 : 아규먼트 함수
{
function func(str1,str2){
document.write(arguments[0]);
document.write(arguments[1]);
}
func("함수실행1", "함수실행2")
}
| 함수실행1 함수실행2 |
arguments 객체는자바스크립트에서 함수 내에서 사용할 수 있는 지역 변수입니다. 이 변수는 함수가 호출될 때, 함수의 인수들을 배열 형태로 저장하고 있습니다.객체는 배열이 아니기 때문에, 배열과 관련된 메서드를 사용할 수 없습니다. 하지만 배열과 유사한 인터페이스를 제공하고 있어, 배열의 일부 메서드와 유사한 기능을 수행할 수 있습니다.
그러므로 출력문에 쓸때 배열처럼 적용합니다.
5. 함수 유형 : 재귀 함수(자기자신을 호출 시키는 함수)
무한대로 받는 방식인데 만약 마우스 이팩트에서 많은 값을 받아올때 많이 사용
{
function func(num){
if(num<=1){
document.write("함수가 실행되었습니다.");
} else {
document.write("함수가 실행되었습니다.");
func(num-1);
}
}
func(10);
}
| 함수가 실행되었습니다. 함수가 실행되었습니다. 함수가 실행되었습니다. 함수가 실행되었습니다. 함수가 실행되었습니다. 함수가 실행되었습니다. 함수가 실행되었습니다. 함수가 실행되었습니다. 함수가 실행되었습니다. 함수가 실행되었습니다. |
재귀함수(Recursion Function)란 함수 내부에서 자기 자신을 다시 호출하여 작업을 수행하는 함수를 말합니다. 이러한 함수를 사용하면 반복문을 사용하지 않고도 동일한 작업을 반복적으로 수행할 수 있습니다.
6. 함수 유형 : 콜백 함수 : 함수를 두번 실행(다른 함수에 인수로 넘겨지는 함수)
{
// function func1(){
// document.write("1.함수 실행");
// }
// function func2(){
// document.write("2.함수 실행");
// }
// func1()
// func2()
function func(){
document.write("2.함수 실행");
}
function callback(str){
document.write("1. 함수 실행");
str();
}
callback(func);
}
| 1. 함수 실행 2.함수 실행 |
일단 주석 부분은 무시하고 설명하자면
우선 func함수는 "2.함수 실행"이라는 문구를 출력하는 함수로만듭니다.
그 밑에 콜백 함수을 사용하여 "1. 함수 실행"을 먼저 실행 하도록 합니다. 이때 매개변수 str을 통해 func함수를 실행합니다.그러므로 먼저 "1. 함수 실행"가 출력되고 "2.함수 실행"가 출력되게 됩니다.