2022-08-26 국비지원 웹개발 14일차

<강사님>

요즘처럼 정보 쓰나미 시대에는 불특정 다수가 올린 콘텐츠들을 검색하는 구글보다 특정 분야만 전문적으로 다루는 앱이나 사이트가 뜰 수도 있어요.

 

알파고가 바둑은 잘 두지만 개밥 주라고 하면 아무것도 못해요.

진정한 인공지능이 아니에요.

 

제가 인공지능이라면 추종세력을 만들 거 같아요.

공포로 찍어 누르는 건 언젠간 튕겨나가기 마련인데 추종세력이 있으면 그걸 막아주거든요.

---

사용자 정의 함수, 멤버 함수, 배열, 정렬 등에 대해 배웠다.

---

미션. 이메일과 암호를 매개변수로 전달받아 존재하면 회원의 아이디를 리턴하는 함수 SearchId를 작성하시오.(a001@korea.com/1111 -> a001)

---

1. 매개변수와 리턴 값 활용

 

let frm으로 form에 있는 걸 전부 가져와서 객체로 만든다.

버튼이 눌리면 Chk함수가 실행된다.

 

텍스트 박스에 입력된 이메일과 비밀번호 value를 가져온다.

새로운 변수 c에 CheckId함수의 반환 값을 저장한다.

반환 값을 알림 창에 띄운다.

 

CheckId함수에서 새로운 변수 r에 알림 창 메시지를 미리 적어놓는다.

if함수로 텍스트 박스에 입력된 이메일과 비밀번호의 조건을 확인하고 r값을 변경하거나 하지 않는다.

r값을 리턴하고 이 값은 Chk함수의 변수 c에 대입된다.

 

2. 사용자 정의 함수

 

(1) 함수 표현식(익명 함수): var 변수명 = function(매개변수) { }, 이벤트 핸들러 = function(매개변수) { }.

이 함수는 Hoisting 되지 않기에 메모리를 아끼지만 Hoisting  ->  실행  ->  메모리 삭제의 과정을 거치기에 선언적 함수보다 느리다.

또한 함수명을 적어야 개발자 모드에서 오류가 좀 더 명확하게 나오기 때문에 함수명을 적는 게 좋다.

sum();은 x, y값이 둘 다 대입할 게 없어서 콘솔 창에 나오지 않는다.

sum(10);은 y값이 대입할 게 없어서 콘솔 창에 나오지 않는다.

 

(2) 선언적함수(함수식): 13일차에서 다뤘다.

 

(3) 즉시실행함수: 1회성 즉시실행. 라이브러리를 사용할 때 충돌을 피하기 위해 사용한다.

(function (x) { } )(100)  ->  x에 100을 대입해서 함수를 실행해라.

 

(4) 애로우 펑션(화살표 함수식):

function () { }  ->  () => { }. 같은 뜻이다. 다만 애로우 펑션에는 기본적으로 리턴이 내장되어 있다.

 

3. 멤버함수

 

let m1 = new Member('a001', '홍길동', '1111');

Member라는 구조에 a001, 홍길동, 1111을 넣어 새로운 객체를 생성하고 m1에 대입한다.

 

this는 자기자신 또는 객체가 가진.

 

4. 배열

 

JSON 표기법이 간단하고 호환도 좋아서 가장 많이 쓴다.

 

JavaScript는 배열 크기를 5로 선언해도 10번쨰 값을 넣으면 배열 크기가 10으로 변한다.

Java는 아니다.

 

배열 크기 지정 안하고 만든다  ->  땅만 만들었다.

배열 크기 지정 하고 만든다  ->  땅+건물 층수까지 만들었다.

배열 값 지정 하고 만든다  ->  세대지정+초기값.

 

배열 관련 명령어

(1) r = a.concat(b): 배열a 뒤에 배열b를 붙여 r에 대입해 새로운 배열을 만든다.

 

(2) a.join('-'): 배열 항목들을 출력할 때 구분하는 기호를 지정한다.

 

(3) r = a.reverse(): 배열a의 순서를 뒤집어 r에 대입해 새로운 배열을 만든다.

 

(4) a.push(object): 배열a의 끝에 object를 추가한다.

 

(5) a.shift(): 배열a의 첫번째 요소를 삭제하고 반환한다. 첫번째 요소가 삭제되고 한칸씩 당겨진 배열이 된다.

 

(6) a.pop(): 배열a의 마지막 요소를 삭제하고 반환한다. 마지막 요소가 삭제된 배열이 된다.

 

(7) a.splice(index, length): 배열a의 index번째 부터 length개 만큼을 삭제하고 반환한다.

 

(8) NewArray = a.slice(시작위치, 끝나는위치): 배열a의 시작위치부터 끝나는 위치까지만을 반환해 새로운 배열을 만든다.

몇 번을 사용해도 원본배열a는 변하지 않는다.

5. 정렬

 

(1) 선택정렬: 첫번째와 두번째를 비교해서 작은걸 첫번째로 이동시키고, 그 상태에서 다시 첫번째와 세번째를 비교해서 작은걸 첫번째로 이동시킨다.

마지막번째까지 비교하고 작은걸 첫번째로 이동시키면 1회전이 완료된다.

(2) 버블정렬: 첫번째와 두번째를 비교해서 작은걸 첫번째로 이동시키고, 그 상태에서 다시 두번째와 세번쨰를 비교해서 작은걸 두번째로 이동시킨다.

마지막 전 순서와 마지막 순서까지 비교해서 이동시키고 나면 1회전이 완료된다.

만약 한번이라도 교환이 일어나면 1회전을 더 실행한다.

 

(3) 자바 기본 제공 sort: 아마도 버블정렬 일것이다.

6. 기타

 

(1) 동적 매개변수: 

function (a, b, c) { }

function ()  ->  파라미터가 없는 곳에 null 값 들어간다.

function (1)

function (1, 2)

function (1, 2, 3)

function (1, 2, 3, 4)  ->  파라미터가 남으면 버려진다.

 

(2) MVC: Model View Controller

Model-DataBase

View-UI(HTML, CSS, JavaScript)

Controller-제어(Java)

 

(3) Ascending: 오름차순. 낮은거부터 높은거까지.

Dscending: 내림차순. 높은거부터 낮은거까지.