[JavaScript Challenge] 모던자바스크립트 딥 다이브 마라톤 8회차

🚀 JavaScript Challenge 🚀 자바스크립트 첼린지 노션 학습노트 바로 가기 >> 안녕하세요 ! 챌린지라는 단어를 들으면 뭔가 설레지 않나요? 💪🏻 챌린지는 어려운 사업이나 기론 경신 따위에 맞섬을 비유적으로 이르는 말이라고 합니다 :) 저희 스터디는 끊임없이 도전하며 서로의 성장을 도모합니다.저희는 서로 배운 내용을 공유하며, 부족한 부분을 채워주며 함께 성장하는 스터디 입니다. 반갑습니다 🙌🏻 🌟 스터디 진행 회차 및 일자 🌟 [JavaScript Challenge] 8회차(2021.08.14) 토요일 ✏️ 스터디 주요 내용 ✏️ 📚 학습 노트 📘 최재영 님의 학습노트 📘 김수진 님의 학습노트 📘 노가혜 님의 학습노트 📘 김주영 님의 학습노트 📚 학습 진도 🧑🏻‍💻김주영 - Strict mode 👩🏻‍💻김수진 - 실행컨텍스트 🧑🏻‍💻최재영 - 실행컨텍스트 👩🏻‍💻노가혜 - 클로저 🧑🏻‍💻 다음번 스터디 주제 👩🏻‍💻 👩🏻‍💻 김수진 ⇒ 클로저의 활용 🧑🏻‍💻 최재영 ⇒ 클래스 👩🏻‍💻 노가혜 ⇒ 클래스 🧑🏻‍💻 김주영 ⇒ 클래스 오늘도 다들 학습하시느라 고생 많으셨습니다.

[💪🏻Altong Study] 자바스크립트 알고리즘 스터디 3회차

🦾 Altong Study 🦾 알통 노션 학습노트 바로 가기 >> 안녕하세요 ! 본격 알고리즘 통달 스터디 알통 입니다 ! 통달이라는 뜻 알고 계시나요? 통달 - 사물의 이치나 지식, 기술 따위를 훤희 알거나 아주 능란하게 하다 :) 저희의 목표는 알고리즘 기초부터 시작해서 차근차근 통달해 가는 것을 목표로 합니다 ! 저희 스터디는 프로그래밍 언어 JavaScript를 활용하여, 기초부터 시작하여 성장하는 스터디입니다 ! 혼자만의 성장이 아닌 함께 성장하는 스터디입니다. 반갑습니다 🙌🏻 🌟 스터디 진행 회차 및 일자 🌟 [💪🏻Altong Study] 3회차(2021.08.13) 목요일 ✏️ 스터디 주요 내용 ✏️ 📚 학습 노트 📘 최재영 님의 Pull Request [ click ] 📘 통붕이 님의 Pull Request [ click ] 📘 김우정 님의 Pull Request [ click ] 🧑🏻‍💻 다음번 주제 및 공지사항 👩🏻‍💻 오늘도 학습하시느라 다들 고생 많으셨습니다.

[💪🏻Altong Study] 자바스크립트 알고리즘 스터디 2회차

🦾 Altong Study 🦾 자바스크립트 첼린지 노션 학습노트 바로 가기 >> 안녕하세요 ! 본격 알고리즘 통달 스터디 알통 입니다 ! 통달이라는 뜻 알고 계시나요? 통달 - 사물의 이치나 지식, 기술 따위를 훤희 알거나 아주 능란하게 하다 :) 저희의 목표는 알고리즘 기초부터 시작해서 차근차근 통달해 가는 것을 목표로 합니다 ! 저희 스터디는 프로그래밍 언어 JavaScript를 활용하여, 기초부터 시작하여 성장하는 스터디입니다 ! 혼자만의 성장이 아닌 함께 성장하는 스터디입니다. 반갑습니다 🙌🏻 🌟 스터디 진행 회차 및 일자 🌟 [💪🏻Altong Study] 1회차(2021.08.06) 금요일 ✏️ 스터디 주요 내용 ✏️ 📚 학습 노트 📘 최재영 님의 학습노트 [ click ] 📘 손수림 님의 학습노트 [ click ] 📘 통붕이 님의 학습노트 [ click ] 📘 김우정 님의 학습노트 [ click ] 📚 피드백 노트 📒 최재영 님의 피드백노트 [ click ] 📒 손수림 님의 피드백노트 [ click ] 📒 통붕이 님의 피드백노트 [ click ] 📒 김우정 님의 피드백노트 [ click ] 📚 배분 문제 🧑🏻‍💻최재영 - 가장 긴 문자열 👩🏻‍💻손수림 - 문자찾기 🧑🏻‍💻통붕이 - 중복문자제거 🧑🏻‍💻김우정 - 일곱난쟁이 🙋🏻 스터디에서 나왔던 질문 🙋🏻‍♀️ Q1. for of 문의 symbol.iterator가 무슨 의미인가요? 🧑🏻‍💻 질문에 대한 답변 👩🏻‍💻 통붕이 님의 답변 symbol.iterator 를 가지고 있을 경우 for of 문을 활용해서 값을 열거할 수 있다. 객체 형태는 for in 으로만 열거가 가능하다. 또한 객체 형태에는 symbol.iterator 가 존재하지 않는다. for of 문의 동작 원리 for of문이 순회하며 값을 열거하기 시작할 때 next() 라는 메서드가 호출이 되고있다. 순회를 통해서 만약 done의 프로퍼티가 true가 될 경우 순회를 이터레이터를 종료한다 ! 🧑🏻‍💻 다음번 주제 및 공지사항 👩🏻‍💻 다음 스터디 공지사항 및 주제 [click] 오늘도 다들 학습하시느라 고생 많으셨습니다.

[JavaScript Challenge] 모던자바스크립트 딥 다이브 마라톤 7회차

안녕하세요 ! 챌린지라는 단어를 들으면 뭔가 설레지 않나요? 💪🏻 챌린지는 어려운 사업이나 기론 경신 따위에 맞섬을 비유적으로 이르는 말이라고 합니다 :) 저희 스터디는 끊임없이 도전하며 서로의 성장을 도모합니다.저희는 서로 배운 내용을 공유하며, 부족한 부분을 채워주며 함께 성장하는 스터디 입니다. 반갑습니다 🙌🏻 🌟 스터디 진행 회차 및 일자 🌟 [JavaScript Challenge] 7회차(2021.08.05) 목요일 ✏️ 스터디 주요 내용 ✏️ 📚 학습 노트 📘 최재영 님의 학습노트 📘 김수진 님의 학습노트 📘 노가혜 님의 학습노트 📚 피드백 노트 📒 최재영 님의 피드백노트 📒 김수진 님의 피드백노트 📒 노가혜 님의 피드백노트 🙋🏻 스터디에서 나왔던 질문 🙋🏻‍♀️ Q1. 보이지 않는 개념 블록이라는 것은 무엇인가요? 🧑🏻‍💻 질문에 대한 답변 👩🏻‍💻 Q1. 보이지 않는 개념 블록이라는 것은 무엇인가요? 김수진 님의 답변 TDZ : 보이지 않는 개념 블록 ⇒ let, const로 선언한 변수는 "선언 단계" 와 "초기화 단계"가 분리 ⇒ 단계 사이에는 일시적 사각지대(TDZ)가 존재, 변수를 선언하기 전에는 TDZ에서 관리 ⇒ 변수를 선언하기 전에 사용한다면 TDZ에서 ReferenceError 발생 🧑🏻‍💻 다음번 스터디 및 공지사항 👩🏻‍💻 8월 6일 공지사항 보러가기 [click] 오늘도 다들 학습하시느라 고생 많으셨습니다.

[JavaScript Challenge] 모던자바스크립트 딥 다이브 마라톤 6회차

🚀 JavaScript Challenge 🚀 자바스크립트 첼린지 노션 학습노트 바로 가기 >> 안녕하세요 ! 챌린지라는 단어를 들으면 뭔가 설레지 않나요? 💪🏻 챌린지는 어려운 사업이나 기론 경신 따위에 맞섬을 비유적으로 이르는 말이라고 합니다 :) 저희 스터디는 끊임없이 도전하며 서로의 성장을 도모합니다.저희는 서로 배운 내용을 공유하며, 부족한 부분을 채워주며 함께 성장하는 스터디 입니다. 반갑습니다 🙌🏻 🌟 스터디 진행 회차 및 일자 🌟 [JavaScript Challenge] 6회차(2021.07.24) 토요일 스터디 원 한분이 더 이상 참여를 못하게 되었습니다 ! ✏️ 스터디 주요 내용 ✏️ 📚 학습 노트 📘 최재영 님의 학습노트 📘 김수진 님의 학습노트 📘 조항주 님의 학습노트 📘 노가혜 님의 학습노트 📚 학습 진도 최재영 19장 - 객체 지향 프로그래밍 조항주 19장 - 프로토타입의 생성 시점 김수진 19장 - 오버라이딩과 프로퍼티 섀도잉 노가혜 19장 - 정적 프로퍼티 / 메서드 🙋🏻 스터디에서 나왔던 질문 🙋🏻‍♀️ Q1. 프로토타입 교체는 어떻게 이루어지는 건가요? Q2. Create.new에 관하여 🧑🏻‍💻 질문에 대한 답변 👩🏻‍💻 Q1. 프로토타입 교체는 어떻게 이루어지는 건가요? 김수진 님의 답변 ✅ 생성자 함수의 prototpye 프로퍼티를 통해 프로토타입을 교체 할 경우 constructor의 링크가 깨지며 새로운 프로토타입으로 교체가 되어버린다. 이 때 constructor는 프로토타입 체인에 의하여 Object.prototype의 constructor의 값을 가리키게된다. 그렇기에 constructor의 링크를 깨뜨리지 않기 위해서는 아래 코드처럼 입력을 해야한다 const Person = (function () { function Person(name) { this.name = name; } // ① 생성자 함수의 prototype 프로퍼티를 통해 프로토타입을 교체 Person.prototpye = { // constructor 연결 constructor: Person, sayHello() { console.log(`Hello! I'm ${this.name}`); } }; return Person; }()); const person1 = new Person('kim'); console.log(person1.constructor); // Person console.log(person1.constructor === Object); // false Create.new에 관하여 최재영 님의 답변 Object.create = 정적 메서드 ??????? // Object.create = 정적 메서드 const obj = Object.create({ name: 'Lee' }); console.log(obj); // {} // Object.prototype.hasOwnProperty = 프로토타입 메서드 console.log(obj.hasOwnProperty('name')); // false ✅ console.log(obj) 시에 빈 칸이 나오는 이유 Object.create 를 사용하여 프로퍼티를 추가 할 경우에 새로운 프로토타입에 프로퍼티를 추가하는 것이므로 obj 객체 내에는 아무런 프로퍼티가 생기지 않음 만약 빈칸이 아닌 프로퍼티를 추가하고 싶다면 아래와 같이 객체내에 직접적으로 추가해야함. const obj = Object.create({ ProtoName: 'Lee' }); obj.Objname='Lee' console.log(obj); // {name: "Lee"} console.log(obj.hasOwnProperty('Objname')); // true Protoname 의 프로퍼티가 들어간 객체는 현재 Objname의 프로토타입인 것을 알 수 있음. console.log(obj.hasOwnProperty('name')) 가 false가 나오는 이유 가혜님의 설명 참조 Object.prototype.hasOwnProperty 메서드 → 이름에서 알 수 있듯이 객체 자신에 해당 프로퍼티가 있는지 확인할 수 있는 메서드 const person = { name: 'Lee', address: 'Seoul', }; console.log(person.hasOwnProperty('name')); // true console.log(person.hasOwnProperty('address')); // true console.log(person.hasOwnProperty('age')); // false // toString는 person 객체 자신에는 없으므로 false가 출력이 된다. console.log(person.hasOwnProperty('toString')); // false 결국 기존 name은 객채 자신에 해당 프로퍼티가 존재하는 것이 아닌 프로토타입에 존재했기에 false가 출력된 것임. 🧑🏻‍💻 다음번 스터디 주제 👩🏻‍💻 새로운 인원 충원과 함께 스터디 방향에 대하여 다시 한번 의논해 볼 생각입니다 ㅎㅎ 오늘도 다들 학습하시느라 고생 많으셨습니다.

[Altong Study] 자바스크립트 알고리즘 스터디 1회차

🦾 Altong Study 🦾 자바스크립트 첼린지 노션 학습노트 바로 가기 >> 안녕하세요 ! 본격 알고리즘 통달 스터디 알통 입니다 ! 통달이라는 뜻 알고 계시나요? 통달 - 사물의 이치나 지식, 기술 따위를 훤희 알거나 아주 능란하게 하다 :) 저희의 목표는 알고리즘 기초부터 시작해서 차근차근 통달해 가는 것을 목표로 합니다 ! 저희 스터디는 프로그래밍 언어 JavaScript를 활용하여, 기초부터 시작하여 성장하는 스터디입니다 ! 혼자만의 성장이 아닌 함께 성장하는 스터디입니다. 반갑습니다 🙌🏻 🌟 스터디 진행 회차 및 일자 🌟 [💪🏻Altong Study] 1회차(2021.07.22) 목요일 전원 참석 ! ✏️ 스터디 주요 내용 ✏️ 📚 학습 노트 📘 최재영 님의 학습노트 [ click ] 📘 손수림 님의 학습노트 [ click ] 📘 통붕이 님의 학습노트 [ click ] 📘 이지열 님의 학습노트 [ click ] 📚 피드백 노트 📒 최재영 님의 피드백노트 [ click ] 📒 손수림 님의 피드백노트 [ click ] 📒 통붕이 님의 피드백노트 [ click ] 📒 이지열 님의 피드백노트 [ click ] 📚 배분 문제 🧑🏻‍💻최재영 - 10부제 👩🏻‍💻손수림 - 홀수 🧑🏻‍💻통붕이 - 세 수 중 최솟값 🧑🏻‍💻이지열 - 10부제 🙋🏻 스터디에서 나왔던 질문 🙋🏻‍♀️ Q1. ODD 변수 명의 의미는 무엇인가요? Q2. rest파라미터와 arguments 객체의 차이는 무엇인가요? Q3. if else문을 사용하지 않고 삼항연산자를 사용하신 이유는 무엇인가요? 🧑🏻‍💻 질문에 대한 답변 👩🏻‍💻 Q1. ODD 변수 명의 의미는 무엇인가요? 손수림 님의 답변 변수명을 odd로 지을 경우에는 홀수의 값을 식별할 때 사용하는 변수 네이밍입니다. 변수명을 even로 지을 경우에는 짝수의 값을 식별할 때 사용하는 변수 네이밍입니다. 자세히 알아보기 [ click ] Q2. rest파라미터와 arguments 객체의 차이는 무엇인가요? 통붕이 님의 답변 함수의 내부슬롯인 argument 객체는 유사배열객체이기에 Array에 관련된 함수를 사용할 수 없습니다 반면에 rest파라미터를 사용할 경우에 객체처럼 사용이 가능하여 원소들을 전개하여 사용할 수 있습니다. 함수 객체의 프로퍼티 argument 일반 객체에는 없는 함수 객체 고유의 프로퍼티 function func1(a, b, c) { console.log(arguments); console.log(arguments[0]); console.log(arguments[1]); arguments[2] = 100; } func1(4,5); arguments라는 프로퍼티에 담긴 객체에는 다양한 정보가 담겨있다. 이곳에는 함수에 전달된 인수의 정보를 담고 있다. Q3. if else문을 사용하지 않고 삼항연산자를 사용하신 이유는 무엇인가요? 통붕이 님의 답변 한줄로 표현할 수 있는 조건문의 경우에는 삼항연산자를 표현하는 것이 좀 더 코드의 가독성도 좋고 편리합니다 반면에 좀 더 많은 조건이 들어가는 경우에는 if else문을 사용하는 것이 적합합니다. 상황에 맞게 삼항연산자와 if else문을 사용하시면 좋을 것 같습니다 🧑🏻‍💻 다음번 주제 및 공지사항 👩🏻‍💻 지열님께서 정리해주신 공지사항 및 스터디 주제 7월 22일 첫 스터디 합의 사항 [click] 7월 29일 스터디 문제 및 발표 순서 [click] 오늘도 다들 학습하시느라 고생 많으셨습니다.