함수
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>함수</title>
<script type="text/javascript">
/*
함수란?
1. 코드를 저장하였다가 실행하거나 실행하여 결과값을 도출해내는 것.
2. 함수 선언 : function 키워드를 사용.
3. 기본 함수, 익명 함수
*/
//기본함수
function myFn() {
//alert('안녕하세요'); <<- window 객체에 포함된 함수.
console.log('안녕하세요');
var n1 = 10;
var n2 = 20;
console.log(n1*n2);
}
//함수실행
myFn();
//익명함수
var myFn2 = function(){
//함수 실행시 외부함수 실행
myFn();
}
myFn2();
var myFn3 = function(){
//지역변수의 내부함수
var myFn = function(){
console.log('내부함수 실행');
}
myFn ();
console.log('myFn3 실행');
}
myFn3();
//재귀함수 호출 - 함수를 자기 자신 안에서 실행
var num = 0;
var myFn4 = function(){
num++;
//myFn4();
}
myFn4();
console.log(num);
</script>
</head>
<body>
</body>
</html>
함수 실습
/*
실습 7. 함수 fn을 실행하고, 이 함수의 내부함수인 subFn을 실행시켜 num 값이 50이 되도록 한 뒤 num값을 콘솔에 출력시켜라.
*/
var fn = function(){
var num = 0;
var subFn = function(){
num = 50;
}
subFn();
console.log(num);
}
fn();
/*
실습 8. 함수 fn2를 실행하고, 이 함수의 내부 함수인 subFn를 실행시켜
num의 값이 10이 되도록 하고 num 값을 콘솔에 출력시켜라.
반복문 사용
*/
var fn2 = function(){
var num = 0;
var subFn = function(){
num++;
}
for(var i = 0; i <10 ; i++ ){
subFn();
}
console.log(num);
}
fn2();
/*
실습 9. 함수 fn3에 인수 10,20을 넣어 실행시키고
이 함수의 내부 함수인 subFn을 fn3의 매개변수로 받은 값을 넣어 실행시켜라.
subFn 함수에서는 첫번째 매개변수 값 만큼 반복문을 돌리고
반복문의 인덱스*2번째 매개변수 값을 콘솔창에 출력시켜라.
(반복문 사용)
*/
var fn3 = function(n1, n2){
var subFn = function(sn1, sn2){
for(var i = 0; i <sn1 ; i++){
console.log(i * sn2);
}
}
subFn(n1, n2);
}
fn3(10,20);
/*
실습 10. 함수 fn4는 구구단을 출력하기 위한 함수이다.
fn4를 실행시키면서 삽입하는 인수값 기준으로 구구단을 출력하는 함수를 완성시켜라.
*/
var fn4 = function(n){
for(var i=1; i <= 9; i++){
console.log(n*i);
}
}
fn4(8);
//return : 데이터를 반환하거나 함수를 빠져나올 때 쓴다.
var myFn5 = function(n){
console.log('리턴확인1');
if(n <5){
return;
}
console.log('리턴확인2');
if (n < 10){
return;
}
console.log('리턴확인3');
}
myFn5(2);
//return : 데이터를 반환하기
var myFn6 = function(n1,n2){
return n1 * n2;
}
var getData = myFn6(10, 20);
console.log(getData);
/*
실습 11. 아래의 배열값을 fn함수에서 매개변수로 받아 배열의 총 합산값을 리턴하여라.
*/
var arr = [10,20,30,40,50,60,70,80,90];
var fn = function(nArr){//2. 매개변수 받기 : 함수를 실행하면서 배열울 인수값으로 넣어 실행했기 때문에 매개변수 값을 배열로 받을 수 있다.
var re = 0;
//3. 인수로 배열을 넣었기 때문에 매개변수 값은 배열이다.
//배열의 속성인 length를 사용할 수 있다.
for(var i = 0 ; i < nArr.length ; i++){
re += nArr[i];
}
return re;
}
//1. 함수 실행하면서 배열을 인수값에 넣어 실행하기
console.log(fn(arr));
/*
실습 12. 아래 arr2 배열 값을 함수 fn2에서 매개변수로 받아 배열의 3의 배수값만 합산시켜 리턴하여라.
*/
var arr2 = [2, 3, 5, 7, 9, 12, 13 , 14, 15];
var re2 = 0;
var fn2 = function(a){
for(var i = 0; i < a.length ; i++){
if(a[i] % 3 == 0 ){
re2 += a[i];
}
}
return re2;
}
console.log(fn2(arr2));
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>객체 + 함수</title>
<script type="text/javascript">
/*
실습 13. 객체 obj에 속성 name과 메서드 myFn이 있다.
name 속성의 값은 이순신이다.
메서드 myFn을 실행했을 때 name 속성의 값이 홍길동으로 변환되게 하여라.
*/
var obj = {
name : '이순신',
myFn : function(){
this.name = '홍길동';
}
}
obj.myFn();
</script>
</head>
<body>
</body>
</html>
/*
실습 14. 객체 obj2에 속성 name과 메서드 myFn이 있다.
메서드 myFn 실행 시 인수값을 이름으로 넣어 name 값을 변경시켜라.
*/
var obj2 = {
name : '이순신',
myFn : function(name){
this.name = name;
}
}
obj2.myFn('변경명');
/*
실습 15. 객체 obj3에 속성 arr(배열)과 num(숫자), 메서드 myFn이 있다.
메서드 myFn 실행 시 arr 배열의 속성의 합산값을 num에 대입하여라.
*/
obj3 = {
arr : [10,20,30,40,50,60,70,80,90],
num : 0,
myFn : function(){
for(var i = 0 ; i < this.arr.length ; i++){
this.num += this.arr[i];
}
}
}
obj3.myFn();
console.log(obj3.num);
'JavaScript' 카테고리의 다른 글
[JavaScript] DOM (Document Object Model) ① (0) | 2020.03.16 |
---|---|
[JavaScript] 객체 + 함수 + 반복문 복습 (0) | 2020.03.16 |
[JavaScript] 객체 Object (0) | 2020.03.10 |
[JavaScript] 배열 객체 (0) | 2020.03.09 |