본문 바로가기

프로그래밍233

[220107] this와 new 그리고 arrow function 목차 1. 객체와 this의 차이점 2. this로 객체만들기 3. this의 역할과 응용 4. class로 객체만들기 객체를 만드는 놀라운 기술을 배웠다! 이제 대량생산을 어떻게 쉽고 간단하게 만드는지 알아보자. 객체에 대해서 아래 블로그에 작성해놓았다. https://hancoco.tistory.com/23 [220104] 배열과 객체 / create:function(), 객체 안에 객체or배열 목차 1. 배열과 객체 2. 객체 안에 추가하기 3. 배열과 객체의 데이터타입 배열 (array) 과 객체 (object) 배열이랑 객체가 뭐더라 //배열 array // 배열명 = {값, 값, 값} let arr = [1, 2, 3]; //객체 obj.. hancoco.tistory.com 객체란 붕어빵을 .. 2022. 1. 7.
[220105] 메서드 (split, repeat, replace, repalceAll, includes, indexOf, substring, substr, concat, valueOf, slice, splice) 목차 1. 문자열을 다루는 메서드 오늘 수업은 감자특집이라고 하겠다. 수업을ㅋㅋㅋ 듣고는 있는데 하나도 이해를 못해서 그저 같이 흘러감ㅋㅋㅋㅋㅋㅋ 나는 말하는 감자지만 괜찮아!!!! 괜찮아!!!!! 나는 살아숨쉬는 감자니까 노력하면 나아진다!!! 메서드 특징만 잡자! 객체.함수() 행동하는 애들 -> 행동해서 어떤 것을 가져온다 -> 가져오는 어떤것은 어떤 데이터 타입인가? 이런 흐름을 알면 메서드를 사용할때 왜 리턴값을 알아야하는지, 어떤 데이터 타입에서 활동하는지 알아야하는지 알 수 있다. 문자열이 뭐더라? let str = "000-000-0000"; console.log(typeof(str)); //타입은 string이 나온다 console.log(str.length); //length가 10이 .. 2022. 1. 7.
[220107] 깊은복사, 얕은복사, spread문 목차 1. 저장할때 메모리의 변화 2. 깊은복사 3. 얕은복사 4. spread문 1. 빈 공간의 값은 서로 같을까? : {} == {} console.log(1==1) //true console.log({} == {}) //false //빈 공간이라 같아보이지만 객체는 만들때마다 새로운 값을 부여해서 다르다 //제품을 찍어낼때마다 생산넘버가 다른거라고 생각하자 let a = {} let b = {} console.log(a==b) //false //배열도 객체이므로 비교하면 false a = { name:'ingoo' } //ingoo라는 확실한 값으로 저장함 b = { name:'ingoo' } console.log(a.name === b.name) //true 2. 주소값 자체를 뜯어와서 참조를 해.. 2022. 1. 7.
[220106] forEach문. 차근차근 알아보기 목차 1. foreach로 for문을 대신하기 2. for문의 기본기능 3. for문을 응용하기 forEach로 for문을 대신해보자 function name() {} let newArr=[1,2,3] for(let i=0; i console.log(v)); //이게 forEach문을 사용한 문장 //뭐라는걸까. } forEach문의 형태 array.forEach( callback( currentvalue[, index[, array]])[, thisArg]) forEach 매개변수 callback : (필수) 각 요소에 대해 실행할 함수. 뒤에 따라오는 세가지 매개변수를 받는다 currentvalue : (필수) 처리할 현재 요소 index : (필수아님) 처리할 현재 요소의 인덱스 array : (필.. 2022. 1. 6.
[220105] for문, 이중for문(구구단, 별짓기), 재귀함수, 다이나믹 프로그래밍(피보나치, 메모이제이션) 목차 1. for문 2. 이중for문 3. 구구단만들기 4. 별짓기 5. 재귀함수 for ( 초기문; 조건문; 증강문) for문의 목표 : 내가 같은 코드를 몇번을 반복시킬 것인가 for(let i=1; i 2022. 1. 5.
[220104] 배열과 객체 / create:function(), 객체 안에 객체or배열 목차 1. 배열과 객체 2. 객체 안에 추가하기 3. 배열과 객체의 데이터타입 배열 (array) 과 객체 (object) 배열이랑 객체가 뭐더라 //배열 array // 배열명 = {값, 값, 값} let arr = [1, 2, 3]; //객체 object //key = 값 이름 //value = 값 //객체명 = {key:value, key:value} let obj = {name:'Joo', age:29} 가장 큰 차이점은 값을 저장하는 방식. 쉽게 생각해보자면, 배열은 arr이란 아파트에 "100호에 1이 살고, 101호에 2가 살고, 103호에 3이 산다." 객체는 obj란 아파트에 "name이란 방에 'Joo'가 살고, age란 방에 29가 산다." 방호수로 기억하느냐, 유치원반처럼 개나리반,.. 2022. 1. 4.
[220204] 배열 array, length, typeof, push 목차 1. 배열 2. 배열의 주소 배열의 생성, 데이터 1개 넣기 : let arr = [ ]; 배열의 데이터 타입 알기 : typeof console.log(arr); console.log(typeof arr); //데이터 타입을 말해주는 typeof //object라고 나온다 let str = "글자형이다!!" console.log(str); console.log(typeof str); // 문자 글자형이므로 string이 나온다 배열에 데이터 2개 이상 넣기 arr=[10,20]; console.log(arr); // 컴퓨터가 배열을 새로 만들어서 // 빈 배열에 숫자 10, 20을 넣음 배열에 맨 끝에 데이터 추가하기 : push arr.push(103); console.log(arr); // 개.. 2022. 1. 4.
[221003] 회원가입창 만들기 / 모달팝업창 실습용도 어제오늘 끙끙대던거 처리ㅎ망ㅇ러ㅣ머이멍ㄴ 쓱 보고 고쳐준 교수님 최고다!!! 코드 읽는 능력 최고다!!! 내가 이해한 label의 용도랑 연결연산자(+)는 맞았음. 문제의 시작 : label이랑 input이랑 떨어져도 된다는것을 생각을 못함. //이 자리에 있던 label을 아래로 밀어넣음 //왜? input 아래만 있으면 되는거고, 나는 X가 있을 위치 고정을 원하니까! X //여기로 밀어넣음! name id e-mail phone CSS의 수정 (기존 css) input[id="close"]:checked+label+#content{ display: none; } (수정본 css) input[id="close"]:checked+#content{ display: none; } 2022. 1. 3.
[220103] 자바스크립트 / let, const, ver, else if, 함수 심화,함수 연습문제 목차 1. 변수와 상수 2. 아스키코드 3. else if문 4. 함수 심화 5. 연습문제 let(변수) 변수를 선언 메모리에 저장할 수 있는 공간 확보 그 공간에 월요일 저장 즉, 선언을 하지 않으면 저장할 공간을 만들지 않았으므로 저장이 안됨. 에러발생. 집이 안 지어졌는데 입주를 어떻게 합니까. 자기가 가지고 있는 영역(code block)에서만 실행되는 모습 let a ="pale" //a라는 공간을 만들어서 저장 let a = "apple"//a라는 공간을 만들려고하지만 공간의 이름이 중복됨. 에러발생 { let a="apple"; //code block } 변수만 선언하고 값을 저장하지 않은 경우에 출력을 하면 뭐가 나올까? null상태인가? 아니면 더미값이 있나? let red; consol.. 2022. 1. 3.
[220102] 홈 만들기 구글링하다가 예쁜 잡지프레임 가지고 비율 3:1 확인하면서 만듬. 전체적으로는 주려다가 여백 공부하듯이 하나하나 넣었다. 그러다보니 코드가 엄청나게 난장판인데 나중에 수정하기로 하자. 우선은 완성한데에 의의를 둔다. 클로닝하니까 확실히 머뭇거림도 많이 줄고 어떻게 넣어야할지 조금씩 감이 온다. 안에 들어간 이미지는 구글 무료 이미지. 수정해야 할것 저 팝업창을 회원가입창으로 바꾸기 시간이 없어서 닫는 버튼을 전체 클릭으로 바꿨는데, X버튼으로 만들기 210114 수정본 수정내용 회원가입창을 닫아야 할때 전에는 전체 화면 중 어디나 클릭하면 닫을 수 있게 했다. -> X버튼을 눌러야만 닫을 수 있게 했다. input+lable이 각각 2개가 있었는데, input 1개에 연결된 label 2개로 줄였다. 마.. 2022. 1. 3.