Tegi Log : 블록체인, 축구, 소레어, Sorare 컨텐츠망상공간

💡 JSON은 네트워크 데이터 전송방식의 표준 포맷으로 보편적으로 쓰이고 있습니다. 실제 자바스크립트에서 쓰일때는 파싱을 해야되는데 간단히 살펴봅시다! const character = JSON.parse('{"name":"lena","age": 14}'); console.log(typeof(character)); console.log(character.name); console.log(character.age); //문자열에 적혀있는 객체가 오브젝트타입으로 변환됨. const character2 = JSON.stringify({name:'tom', age:12}); console.log(typeof(character2)); console.log(character2.name); console.log(cha..

💡 document.createElement()를 활용해 엘리먼트를 생성해서 랜덤한 이미지를 나오게 해봅시다. 0,1,2.png로 랜덤하게 선택되고 엘리먼트가 잘 생성된 모습을 볼 수 있습니다. 아직은 Javascript에만 존재하고 document에 존재하지 않으니 body 엘리먼트에 자식으로 붙혀봅시다. 폴더이름도 img와 같아야되고, 이미지를 꼭 코드와 같은 이름으로 해줘야 합니다.

💡 게임이든 웹사이트든 랜덤한 정수값은 어디든 자주 쓰입니다. 한번 구현해봅시다! Math.random(); Math.random();을 호출해보면 0.58, 0.245 , 0.97 등등 이런 실수들이 나오는데요. 지금은 0.단위로 나오기 때문에 10을 곱해주면 이렇게 7.4, 2.6, 9.1 등 단위가 바껴서 나오는 것을 볼 수 있습니다. 하지만 이것을 그냥 쓸 순 없죠. 때에 따라 다르지만, 저는 내림 Math.floor()을 써서 정수로 만들겠습니다. Math.floor(Math.random()*10); /* 1. Math.random()으로 랜덤한 값을 만들고 2. 그 값에 10을 곱해 자릿수를 바꿔준다음 3. Math.floor()로 감싸서 내림을 해준다. */ 랜덤한 정수값이 나오는 것을 확..

Math.floor(1.9) Math.floor()는 소숫점이 무엇이든 내림을 해서 1로 만들어주는 모습을 볼 수 있다. Math.round(1.6); Math.round()는 반올림을 해준다. Math.ceil(1.75) Math.ceil()은 올림을 해주는 것을 볼 수 있다.

💡 setInterval()함수는 일정시간동안 코드를 계속 반복시켜줍니다. 아주 유용하겠죠? 'hi'매개변수를 통해 '안녕 지금 시각은'인자가 들어간 모습. 그리고 반복을 종료시킬수가 있는데 const timer = setInterval(getClock,1000,'안녕 지금 시각은'); clearInterval(timer); 이처럼 clearInterval() 함수로 반복실행을 종료할 수 있습니다.

💡 new Date(); : 현실시간을 받아올 수 있는 객체 padStart(a,b); : 2,3,4 이런 1의자리 숫자들을 02,03,04 이런식으로 10자리로 만들 수 있음. 매개변수a는 어느정도 길이로 할것인지, 매개변수 b는 어떤 문자열로 채울것인지 적는다.

💡 classList.add, remove로 만든 토글함수 //h1태그의 엘리먼트를 변수에 담고 const heading1 = document.querySelector('h1'); //클릭하면 handleH1Click 함수를 호출하는 이벤트를 생성 heading1.addEventListener('click',handleH1Click); //함수생성 function handleH1Click(){ // 클릭드 클래스라는 변수를 만들어서 상태체크 const clickedClass = "clicked"; //클릭드 클래스가 classList에 포함되어있는지 체크 if(heading1.classList.contains(clickedClass)){ //포함 되어 있으면 classList에 있는 클릭드 클래스를 지운..

💡 자바스크립트 배열 특징(다른 언어들에 비해 엄격하지 않다.) 1. 배열안에 다양한 데이터 타입이 들어갈 수 있음. 2. 배열의 크기가 동적으로 변할 수 있다. //Array생성자 활용 const arr1 = new Array(); arr1[0] = '첫번째'; arr1[1] = 111; arr1[2] = true; //초기값 넣고 생성 const arr2 = new Array('두번째',222,false); //new Array생성자의 매개변수는 배열의 크기를 뜻함. 5개의 undefined가 출력됨. const arr3 = new Array(5); //----------------------------------------------------------------------------// // [..