⁂ Java Script/: 기본 익히기

[JS] #9-1 유효성 검사 - 회원가입틀 만들기 1

1. 유효성 검사 Frontend(UI, View)단에서 서로 다른 문법간의 데이터를 교류하기 위해서 JavaScript와 jQuery를 활용한다. 그리고 이 두 가지를 활용해 데이터의 유효성을 검증하기도 한다. 이번에는 데이터가 유효한지, 회원가입 툴을 만들어보며 데이터의 유효성 검사를 배워보려한다. 2-1. 데이터 접근하기 : ID중복확인 1) 아이디 작성 공간과 버튼 만들기 우선 회원가입을 위한 양식을 만들어보자! 아이디를 입력할 공간과 중복확인 버튼, 그리고 적용 버튼을 만들어보려 한다. 그리고 데이터에 접근하기 위해 상단에서 볼 수 있다시피 각 버튼마다 함수를 만들어보려한다. 회원가입 아이디 : HTML 삽입 미리보기할 수 없는 소스 2) getID () 입력된 아이디를 확인하기 위해서 우선 사..

[JS] #8 String 함수

참조 사이트 : https://www.w3schools.com/js/js_string_methods.asp JavaScript String Methods W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more. www.w3schools.com 프로그래밍 언어에서 문자를 나타내는 함수는 정말 다양하다. 이는 그만큼 많은 사람들이 사용할 수 밖에 없다는 뜻이다. 이 문자에 대한 함수인 String에 대해 알아보려 한..

[JS] #7-1 이벤트(Event)

1. 이벤트?😊 미안하지만 설레는 그런 이벤트 아니다(ㅎ). 자바스크립트에서 이벤트란! 무언가의 상황이 벌어지는 것을 뜻한다. 앞에서도 설명했듯 코드를 아무리 잘 짜도 그 코드가 클릭을 해야만 작동되는 것이라면 클릭하기 전까진 아무것도 벌어지지 않는다는 말이다. 결국 자바스크립트는 이벤트를 발생시킨 후 함수를 호출함으로 실행이 된다. 자바스크립트에서 흔히 쓰이는 이벤트는 아래와 같다. 이벤트 설명 onchange 다른 객체로 바뀌었을 때 onclick 마우스를 클릭했을 때 onmouseover 마우스가 올려졌을 때 onmouseout 마우스가 나갔을 때 onkeydown 키보드가 눌렸을 때 onload 문서를 불러오는 작업이 끝났을 때 물론 이 이벤트를 더 세부적으로 표현할 수도 있지만 가장 굵직하고도 ..

[JS] #6-4 함수(Function) : .js파일 만들기

1. .js파일을 만들어보자 .css 파일을 기억하는가? css에서 style들을 저장해두고 불러오기 위해 사용하는 파일이었다. 자바스크립트에서도 비슷한 방식을 사용 가능하다. 바로 .js 파일을 만드는 것이다. 이 파일은 파일 자체가 로 묶여있기 때문에 따로 명시할 필요 없이 필요한 자바스크립트 문법을 사용하면 된다. 비쥬얼스튜디오에서 새 창을 열어서 확장자를 js로 저장한 뒤 아래와 같은 세가지 함수를 만들었다. 1) 두 수 사이의 합을 반환하는 함수 2) 두 수의 차이를 반환하는 함수 3) 윤년과 평년을 반환하는 함수 전체 코드는 아래와 같다. /* myscript.js */ function hap(a,b) { // 두 수 사이의 합을 반환하시오 if(a>b){ let tmp=a; a=b; b=tm..

[JS] #6-3 함수(Function) : 변수의 유효 범위(Scope)

1. 이벤트(event) 맛보기 자바스크립트는 이벤트(event)를 발생시켜서 함수(function)을 호출시켜서 값을 출력시키는 것이 기본적인 형태이다. 예를 들어 버튼을 하나 만들었다. 이 버튼을 가만히 내버려두면 아무런 일도 발생하지 않는다. 이 버튼을 동작하게 하려면 클릭! 이라는 이벤트가 있어야 한다. 이 클릭 이벤트(Click event)로 인해 버튼에 연결되었던 함수가 호출되어 프로그램이 동작을 하는 것이다. 이런 것을 이벤트라고 한다. 그리고 이 이벤트에 대한 동작을 자바 스크립트 또는 jQuery로 실행하게 된다. 2. 변수의 종류 학교에 입학하면 나의 반이 있다. 그리고 수업 시간에 나는 나의 반에 들어가야 한다. 옆에 반에 들어가면 나는 내가 이 시간에 배워야할 것을 배우지 못하게 되..

[JS] #6-2 함수(Function) : 내장 객체(Object)

1. 객체란? 객체는 특정한 기능을 제공받는 것이라 이해하면 된다. 이것은 다른 프로그래밍 언어에서 각기 다른 이름으로 불리지만 결국 목적은 같다. 필요한 기능을 손쉽게 사용하는 것! 아래의 참조사이트를 참고하자. 참조 사이트(객체의 개념) : https://www.w3schools.com/js/js_objects.asp JavaScript Objects W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more. ..