초급의 끄적거림

개인적으로 잘라내서 반환하는 함수가 헷갈리는 부분이 있어서 정의에 대해 정리하려고 한다. 1. slice() slice(시작위치, 종료위치) : 시작위치와 종료위치를 기준으로 문자열에서 해당 부분을 잘라서 반환한다 slice(시작위치) : 종료 위치를 생략할 경우, 시작위치부터 문자열의 마지막까지 잘라서 반환 slice(음수) : 문자열의 끝에서부터 거꾸로 읽어서 반환 let str = "Apple, Banana, Kiwi"; let res = str.slice(7, 13);//Banana let str = "Apple, Banana, Kiwi"; let res = str.slice(7);//Banana, Kiwi let str = "Apple, Banana, Kiwi"; let res = str.sli..

if문 조건식을 위에서부터 차례로 순차비교 때문에 조건에 만족하는 조건식이 제일 마지막에 있다면 무의미한 조건식을 모두 비교하여 내려온다는 비효율적인 현상이 발생 switch문 상수값을 판단하고 일치하는 case 절로 가기 때문에 if문보다는 효율적 비교연산이 필요 없고, 특정 상수 값인 경우 switch 문을 사용하는 것이 유용함

조건식은 true와 false로 따지게 되는데 이 때 조건식을 거짓으로 취급하는 값은 아래와 같다 false undefined null 0 NaN 비어 있는 문자열 ("")

for와 while은 둘다 반복문으로 조건을 만족하는 동안 코드 블록을 반복적으로 수행하는 기능을 한다. for문은 for-loop, for-in, for-of 등이 있고 while문은 while과 do-while이 있다. while문은 조건식이 true인 경우 코드블록을 실행하는데 조건이 false가 되기 전까지 반복하게 된다. while의 경우 조건을 먼저 확인하지만 do-while은 우선 코드를 실행하고나서 조건식을 확인 하기 때문에 무조건 코드를 한 번은 실행하게 된다. for문과 while문은 동일하게 반복문이지만 각자의 실행방식에 차이가 있기 때문에 for문의 경우 배열을 이용해서 반복문을 사용할 때 편리하며 배열이 아닌 특정 조건으로 반복문을 실행할 때는 while문을 사용하는 것이 유용하다.

1. undefined - 단어 그대로 아무것도 존재하지 않는 값 - 변수를 선언하고 값을 할당하지 않은 상태에서 변수를 사용하려고할 때 개발자가 아닌 브라우저 엔진에서 자동할당하고 리턴해주는 값 2. null - undefined와 같이 아무것도 존재하지 않는 값 - undefined와 다르게 개발자가 명시해서 사용하는 것으로, 어떤 데이터 타입이 할당될지 모를 경우 개발자가 명시적으로 null을 부여하여 의도하여 사용하는 존재하지 않는 값 - null은 참조할 필요가 없는 값에 할당하게 되면 특정 위치에 대한 참조가 제거 되기 때문에 메모리 공간을 확보하는 데에 사용하여 메모리를 효율적으로 관리하고 싶을 때 사용할 수 있음

HTML에서 자바스크립트를 작성하는 2곳 1. head 태그 2. body 태그 1. head 태그에 작성할 경우 - 브라우저가 body 태그의 HTML 코드를 실행하기 전에 자바스크립트 코드를 먼저 해석하게 되기 때문에 자바스크립트 코드를 모두 해석하고 HTML 코드를 해석 하게 되면 웹페이지의 딜레이가 발생 2. body 태그에 작성할 경우 - body 태그 제일 하단에 태그를 작성함 - body 태그에 있는 HTML 코드가 모두 실행되어 화면이 구성된 후 자바스크립트 코드를 실행하기 때문에 페이징 로딩 속도를 비교적 빠름 때문에 별도의 스크립트 파일을 생성해서 사용하는 것이 아닌 HTML 파일 안에서 스크립트 태그를 사용할 때는 body 태그 하단에 위치하는 것이 좋다.

encodeURIComponent란 URI로 데이터를 전달하기 위해서 문자열을 인코딩할 때 사용함 모든 문자를 인코딩하는 함수 용도 웹에서는 파라미터를 전송할 때 & 나 / 그리고 =와 같은 특정 문자들을 특정 기능으로 사용함. 그런데 파라미터에 해당 특수문자들이 들어가게 됐을 경우, 제대로 인식 하지 못하게 되는 불상사가 발생할 수도 있기 때문에 변환하는 작업이 필요함. >>> 이럴 때 사용하는 함수 예제 function uriBtn(link){ var transUri = encodeURIComponent(link); document.getElementById("beforeUri").innerHTML = link; document.getElementById("transUri").innerHTML = t..

img태그에 click 이벤트 걸기 1. 처음 시도 했던 방법 img 태그 내에 onclick 이벤트를 사용함 그러나 웹표준의 기본정의 상, 스크립트와 스타일은 html태그에서 분리를 하는 것이라는 것을 알게 됨 그래서 img 태그 내에 javascript: 를 붙이는 건 웹표준에 어긋 난다고 볼 수 있다. (a 태그도 마찬가지) 2. 때문에 시도하게 된 방법 $(function(){ $("#kakaoLogin").click(function(){ //사용하고자 하는 함수 fn_kakaoLogin('Kakao'); }); }); function fn_kakaoLogin(type){ alert("loginType : " + type); } 위에서 만든 함수를 실행했을 때 아래와 같은 알림창을 볼 수 있음