본문 바로가기
깃허브 링크!

javascript

js 변수와 함수 자바스크립트 ver message = ‘h1’;변수선언 변수 = 값 console.log(message);변수를 보여달라 = hi가 출력됨 초창기에는 var 사용현재는 const 사용 const나 var을 입력하면 보라색이 뜨는데이거는 이미 js에서 사용하는 언어라는것을 뜻함 js에는 let으로 정의하는걸 추천 그러면 const 와 let의 차이점은let은 한번 선언하고 나서 변수의 값을 변경가능하다const는 이미 한번 선언하면 변경 불가능하다 let b = 20;b= 30;이러면 20에서 30으로 변경됨 let a = 10;let b = ‘hi’;let c = true;let d = [];let e = {}; 숫자문자열지니값배열객체등 다양한 데이터 유형이 배열에 선언될수 있다. 카.. 더보기
setInterval() 메서드 this 이벤트 리스너 setTimeout() 메서드 (호출할 함수,지연시간) setInterval() 지정된 시간 간격마다 지정된 함수 반복적으로 호출한다. setInterval() 메서드를 사용하여 printCurrentDate() 함수를 2초(2000밀리초)마다 실행하는 것을 의미 이렇게 설정된 간격마다 printCurrentDate() 함수가 호출된다. printCurrnetDate() 함수는 현재 시간을 가져와서 html 문서의 date라는 id를 가진 요소의 내용을 업데이트한다. document.getElementById("date")를 사용하여 해당 요소를 선택하고 .innerHtml 속성을 사용하여 내용을 변경한다. 더보기
js( foreach활용,쿼리셀렉터,onclick,`${}`) 여기서는 myonclick의 기능을 한번 살펴볼건데 onclick은 html요소에서 사용되는 이밴트 핸들러로 요소를 클릭했을때 해당 이벤트가 발생하도록 설정 Click me 예를 들어 이런코드가 있다면 onclick속성에는 myfunction()이라는 자바스크립트 함수가 할당되어 있다. 이 버튼을 클릭하면 myfunction()함수가 실행된다. querySelector()와 querySelectorAll() 메서드는 css 선택자를 사용하여 요소를 선택하는 javascript의 기능 이들 메서드를 사용하면 원하는 요소를 쉽게 선택하고 조작가능하다. querySelector() 메서드는 주어진 css선택자와 일치하는 첫번째 요소를 반환한다. 예를 들어 첫 번째 요소 두 번째 요소 위의 코드에서 highli.. 더보기
Do it 자바스크립트 + 제이쿼리 입문 5일차 getInfo()메서드가 let jang = new Checkweight("장보리",168,62); 여기에 있는 객체 ("장보리",168,62)이걸 뽑아서 문자열을 생성해준다. get info()메서드는 checkweight 객체에서 생성된 개별 객체의 정보를 문자열로 반환하는 역할을 한다. this 키워드는 해당 메서드가 속한 객체를 참조하는데 checkwieght 객체를 참조해준다.그래서 this.getinfo와 this.getResult는 해당 메서드가 속한 객체를 참조하는데 this.username,this.userHeight, this.userWeight, this.minWeight, this.maxWeight는 Checkweight 객체에서 선언된 속성 값을 참조한다. -------------.. 더보기
Do it 자바스크립트+제이쿼리 입문 4일차 함수 함수란? 기본 함수 정의문 변수를 선언할 때 let 키워드를 사용한것처럼 함수에서는 function 키워드를 사용해 변수를 선언한다. 일반 함수 정의 방식 하지만 익명함수 (함수명이 없는 함수) ex) testFnc(); let testFnc = function(){ 자바스크립트 코드;} 이건 오류가 발생한다. ---------------------------------- 일반 함수문과 익명 함수 같이 쓴 예제 --------------------- 매개변수가 있는 함수 정의문 기본 함수 정의문은 함수 안에 있는 코드를 실행할 때 단순히 함수명으로 호출해서 코드를 실행했다. 즉 함수를 호출할 때 값을 전달할 수 없었다. 하지만 매개변수가 있는 함수 정의문은 함수를 호출할때 전달하고자 하는 값을 입력하여 .. 더보기
Do it 자바스크립트 + 제이쿼리 입문 4일차 함수 전까지 p.112 open()메서드 이용해 팝업창 나타내기 open()메서드를 이용하면 지정한 URL 페이지를 새 브라우저 창에 나타낼수 있다. 즉 이 기능을 이용하면 광고에 자주 사용되는 팝업 창을 만들수 있다. window.open("http:www.easyspub.com/","esatspub","width=350, height=400, left=50, top=10, scrollbars=no"); 일정한 시간 간격으로 코드 실행하기 1.setIntetval =일정한 시간 간격으로 코드를 반복 실행 2.setTimeout =일정한 시간 후에 코드를 실행하고 종료 **이때 시간 간격은 1/1000초 단위(ms)로 작성해야 한다. 즉 3초 간격으로 설정하려면 3,000(3,000 *1/1000)으로 작성해야 한다.. 더보기
do it 자바스크립트+제이쿼리 입문 3일차 자바스크립트:객체 기반 프로그래밍 언어 기본형:객체.메서드(); 객체.속성; 또는 객체.속성=값; 객체의 종류 내장 객체 : 자바스크립트 엔진에 내장되어 있어 필요한 경우에 생성해서 사용가능하다. 브라우저 객체 모델 : (BOM)은 브라우저에 계층 구조로 내장되어 있는 객체를 말한다. 문서 객체 모델 ---- concat은 문자열을 이어준다. let userName = prompt("당신의 영문 이름은?"); let upperName = userName.toUpperCase(); document.write(upperName," "); let userNum = prompt("당신의 연락처는?",""); let result = userNum.substring(0, userNum.length -4) + "**.. 더보기
웹프로젝트 로그인창완료 ------- 로그인창 자바스크립트 function signup(){ let savedUsername_test = ""; let savedPassword_test = ""; let savedNickname = document.getElementById('nickname').value; //vaule 가져온다. let savedName = document.getElementById('name').value; let savedPassword = document.getElementById('password').value; console.log(savedNickname); console.log(savedName); console.log(savedPassword); localStorage.setItem("user.. 더보기