<파일을 다운로드, import 해서 내부 네트워크에서 사용>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>제이쿼리 임포트</title>
<script type="text/javascript" src="./resource/js/jquery-3.4.1.min.js"></script>
</head>
<body>
</body>
</html>
*.min.* < 들여쓰기, 공백, 행간, 주석이 무시되어 압축됨. 용량이 작아 로딩 속도가 빠름.
<외부 네트워크에 접근해서 사용>
첫번째 인수에 선택자를 잘 파악해서 대입해 객체 반환.
$('article').click(function(){console.log('article클릭')})
$('article').click(function(e){console.log('article클릭',e)})
위치값이 같이 출력됨.
callback 함수
var call = function(myFunction) {
console.log(typeof myFunction);
if(typeof myFunction =='function'){
myFunction('안녕하세요');
}
};
call(function(msg) {
console.log(msg);
})
var sum = function(n1, n2, fn){
if(typeof fn == 'function'){
fn(n1 + n2);
}
};
sum (10,20,function(n){
console.log(n);
})
callback 함수 실습
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>콜백함수 실습</title>
<script type="text/javascript">
/*
실습1. sum이라는 함수가 있다. 첫번째 인수는 배열, 두번째 인수는 함수이다.
sum함수를 실행시켜 배열의 총 합산값을 2번째 인수의 함수의 매개변수로 받도록 하여라.
*/
var arr = [10, 20, 30, 40, 50];
var sum = function(arr, fn){
if(typeof fn == 'function'){
var sig = 0;
for(var i = 0; i <arr.length ; i++){
sig+=arr[i];
}
fn(sig);
}
};
sum(arr,function(n1){
console.log(n1);
});
/*
실습2. strFn이라는 함수가 있다. strFn함수의 첫번째 인수는 문자열, 두번째 인수는 함수이다.
strFn 함수가 실행시 첫번째 인수에 담긴 문자열 값을 '-' 특수기호로 구분하여 배열로 2번째 인수의 함수의 매개변수로 반환하여라.
strFn('한국스마트-정보교육원',function(){
})
*/
/* var strFn = function(str, fn){
if(typeof fn == 'function'){
var string = '';
string = str.split(str,'-');
fn(string);
}
};
strFn('한국스마트-정보교육원',function(arr){
console.log(arr);
})
*/
var strFn = function(str, fn){
if(typeof fn == 'function'){
fn(str.split(str,'-'));
}
};
strFn('한국스마트-정보교육원',function(arr){
console.log(arr);
})
</script>
</head>
<body>
</body>
</html>
'JavaScript' 카테고리의 다른 글
[JQuery] 속성 조작 메서드 / 객체 편집 메서드 / 동적바인딩 (0) | 2020.03.30 |
---|---|
[JQuery] 선택자 / 탐색선택자 (0) | 2020.03.24 |
[JavaScript] 문자열 객체 / 브라우저 객체 모델 (0) | 2020.03.23 |
[JavaScript] Date 객체, 날짜 관련 메서드 / 문자열 객체 메서드, 속성 조금 (0) | 2020.03.17 |