본문 바로가기

ONLINE COURSES/JavaScript13

FreeCodeCamp_JS_TIL_DAY3 0. use destructuring assignment to extract values from objects. : neatly assigning values taken directly from an object. 1. use destructuring assignment to assign values from objects. : allows you to assign a new variable name when extracting values. do this by putting the name after a colon when assigning the value. const user = {name:'sam lee', age:30}; const {name:userName, age:userAge} = use.. 2021. 7. 5.
FreeCodeCamp_JS_TIL_DAY2 1. operator > does convert data types of values while comparing. 2. switch if you have many options to choose from, use a swith statement. a switch statement tests a value and can have many case statements which define various possible values. statements are eeuted from the first matched case values until a break is encountered. case - 한번에 여러개를 쓸 수 있음. default - 해당하는 case 가 없는 경우 default에 저장된 내용.. 2021. 6. 26.
FreeCodeCamp_JS_TIL_DAY1 1. Escaping quotes Quotes are not the only characters that can be escaped inside a string. there are two reasons to use escaping characters. 1. to allow you to use characters you may not otherwise be able to type out, such as carriage return. 2. to allow you to represent multiple quotes in a string without javascript misinterpreting what you mean. code output \' single quote \" double quote \\ b.. 2021. 6. 23.
DOM-3 0. classses and attribute ////classes and attribute const firstli = document.querySelector('li:first-child'); const link = firstli.children[0]; //엑스자표시 let val; //classes val = link.className; val = link.classList; val = link.classList[0]; link.classList.add('test'); link.classList.remove('test'); val = link; //attribute val = link.getAttribute('href'); val = link.setAttribute('href', 'http://go.. 2021. 6. 15.
DOM-2 0. traversing the dom traversing: 대상을 바꿔서 체인을 계속하는것. - childNodes -> nodelist 출력 - children -> HTML collection 출력 let val; const list = document.querySelector('ul.collection'); const listitem = document.querySelector('li.collection-item:first-child'); val = listitem; val = list; //get child nodes val = list.childNodes; // 뒤의 띄어쓰기를 text로 지정해 갯수를 셈 //childNodes -> returns nodelists. //get children.. 2021. 6. 14.
DOM-1 0. examining the document type // examining the document type let val; val = document; val = document.all; val = document.all[2]; val = document.all.length; val = document.head; val = document.doctype; val = document.domain; val = document.URL; val = document.characterSet; val = document.contentType; val = document.forms; val = document.forms[0].id; val = document.forms[0].action; val = document.. 2021. 6. 14.
Basics-4 0. prompt : input값을 받아서 alert창으로 띄움 const input = prompt(); alert(input); 1. confirm if(confirm('are you sure')){ console.log('yes'); //확인클릭 -> yes 출력 } else { console.log('no'); //취소클릭 -> no 출력 } 2. Outer & Inner height, width let val; //outer height and width val = window.outerHeight; //window.outerHeight == 현재 윈도우창의 높이 val = window.outerWidth; //window.outerWidth == 현재 윈도우창의 너비 //Inner height.. 2021. 6. 13.
Basics-3 function // loops // iterations 0. FUNCTION DECLARATIONS //FUNCTION DECLARATIONS function greet(firstname, lastname){ return 'hello '+ firstname + lastname; } console.log(greet('nick', ' james')); // hello nick james function greet(firstname = 'nick', lastname = ' james'){ return 'hello '+ firstname + lastname; } console.log(greet()); //hello nick james 1. FUNCTION EXPRESSIONS const 제곱 = function(x){ return x*x; }; console.log.. 2021. 6. 13.
Basics-2 0. template literals : ` ${ } ` const name = 'Richard'; const age = 30; const job = 'web developer'; const city = 'London'; // without template strings (es5) html = 'name: ' + name + 'age: ' + age +' job: ' +job+'age: '+age+' '; html = '' + 'name: ' + name + '' + 'age: ' + age + '' + 'job: ' + job + '' + 'city: ' + city + '' + ''; function hello(){ return 'hello'; } //with template strings (es6).. 2021. 6. 12.