본문 바로가기

전체 글145

HackerRank: 공통 하위(가장 긴 공통 후속) — JavaScript 해커랭크에 대한 공통 차일드 챌린지는 고전적인 LCS(Longest Common Sequence) 문제의 별명이다. 이 문제에 대한 링크는 다음과 같습니다. 시퀀스는 0개 이상의 문자가 삭제된 원래 문자열에서 파생된 새로운 문자열이며, 문자열에 남아 있는 문자의 상대적 순서를 변경하지 않습니다. 이 문제와 관련된 우리의 작업은 주어진 문자열 2개에 공통적인 가능한 가장 긴 연속의 길이를 찾고 반환하는 것이다. 공통 수열이 없으면 0을 반환합니다. 이 문제를 해결하기 위한 몇 가지 다른 접근법이 있다. 브루트 포스 접근법은 각 문자열에 대해 가능한 모든 수열을 생성하고 가장 긴 공통 수열을 찾는 것을 포함한다. 이는 기하급수적인 시간 복잡성을 의미하며, 이 과제에서 문자열 길이에 대한 제약 조건이 5000.. 2022. 1. 11.
페어 프로그래밍 페어 프로그래밍이란? 페어 프로그래밍은 하나의 화면을 공유하는 두 명의 프로그래머가 함께 하는 코딩 연습이다. 이 작업은 VSCode Live Share와 같은 플랫폼을 사용하거나 서로 나란히 앉아서 수행할 수 있습니다. 프로그래머 중 한 명은 드라이버로, 다른 한 명은 네비게이터로 불린다. 간단히 말해서 "드라이버"는 코드를 입력하는 사람이고, "네비게이터"는 입력해야 할 것을 지시하는 개발자이다. 이러한 역할들은 종종 서로 교환되어 각 개발자가 코드를 작성할 수 있도록 한다. 그들은 코드가 무엇을 하고 있고 다음에 무슨 일이 일어나야 하는지를 겪는다. 페어 프로그래밍은 두 개발자가 작업을 진행하면서 참여하며 구두로 의사소통하는 경우에만 작동합니다. 나한테 뭐가 먹혔지? 내가 처음으로 페어링 프로그램을.. 2022. 1. 11.
JavaScript의 스택 데이터 구조 이해—JavaScript는 이를 어떻게 사용합니까? 나는 스택이라는 단어를 처음 봤을 때 이해하기 쉬웠던 것 같아. 그런데 자바스크립트를 배우다가 동기식, 비동기식, 콜스택을 접했을 때 조금 혼란스러웠습니다. 저와 같은 혼란스러운 분들을 위해 이 글을 쓰고 있는데, 이 글을 마치면 여러분이 스택 데이터 구조와 자바스크립트가 어떻게 사용하는지에 대해 더 잘 이해할 수 있기를 바랍니다. 개요 이 글에서는 스택 데이터 구조, 자바스크립트 동기/비동기 및 콜 스택이 어떤 형태인지, 어떻게 사용되는지 알아보겠습니다. JavaScript에 익숙하다면, 매일 사용하는 JavaScript Runtime의 작동 방식에 대한 새로운 통찰력을 얻을 수 있기를 바랍니다. 그리고 만약 당신이 자바스크립트를 상대적으로 처음이라면, 바라건대, 이것은 당신이 자바스크립트의 작동 방식.. 2022. 1. 11.
플랫아이언 스쿨 소프트웨어 엔지니어링 1단계 완료! — 내 프로젝트 격심한 3주(엄밀히 말하면 휴일 휴식 덕분에 4주) 후에 나는 성공적으로 1단계를 마쳤다. 플랫아이언 스쿨 소프트웨어 엔지니어링 라이브 프로그램. 별도의 게시물을 통해 지금까지의 AWESS 경험에 대한 제 생각을 되돌아보겠지만, 먼저 제 1단계 프로젝트를 공유하고 싶었습니다. 1단계는 Javascript를 중심으로 진행되었으며, 시작하기 전에 사전 작업 커리큘럼에서 학습한 HTML과 CSS를 기반으로 합니다. 우리의 과제는 피치, 개발, 프레젠테이션까지 우리의 첫 번째 웹 기반 앱을 개발하는 것이었습니다. 제 파트너인 Gian과 저는 레시피 API(이 경우 데이터를 얻을 수 있는 온라인 데이터베이스)를 활용한 앱을 개발하기로 했습니다. 사용 가능한 공개 API 중 일부를 탐색한 후(키가 필요하지 않거나 .. 2022. 1. 11.
Nullish 병합 연산자(?) Nullish 병합 연산자(??)는 왼쪽(첫 번째 인수)이 null이거나 정의되지 않은 경우에만 연산자(두 번째 인수)의 오른쪽을 반환하는 논리 연산자이다. 다른 모든 경우에는 첫 번째 인수를 반환합니다. 좀 더 명확히 하기 위해 예를 보겠습니다. 위의 예에서 보셨듯이 정의되지 않은 연산자가 연산자 왼쪽에 있기 때문에 Hello가 반환됩니다. null이 정의되지 않은 위치였다면 결과는 동일했을 것이다. 그리고 두 번째 예에서 첫 번째 인수에 null이 아니거나 정의되지 않은 것이 있다면 연산자는 두 번째 인수를 확인하지 않고 바로 첫 번째 값을 출력한다. ECMAScript 2020에 추가된 이유 그래서 우리가 변수에 기본값을 부여하고자 할 때마다 OR ( || ) 논리 연산자를 사용했다. 그러나 OR .. 2022. 1. 11.
Javascript에서 Promise 개체의 기본 제공 메서드 만약 당신이 자바스크립트 개발자로 일한 지 오래되었다면, 당신은 Promise를 발견했을 것이다. 그렇지 않다면 간단한 소개를 하겠습니다. 나는 오랫동안 약속들을 다뤄왔고, 그것들이 자바스크립트에서 비동기 동작을 나타내는 좋은 방법이라고 생각한다. 이 제품들은 훌륭하지만, 여전히 우리 대부분이 알지 못하는 내장 기능들이 많이 있습니다(일주일 전까지만 해도요. 오늘 이 게시물을 통해 저는 Promise 객체의 4가지 흥미로운 빌트인 특징을 설명하고자 합니다. 먼저 데모에 사용한 유틸리티에 대해 살펴보겠습니다. // configs for the createPromiseArrayFromConfig function const allItemsWillResolve = [ { settleAfterSeconds: 1,.. 2022. 1. 11.
用javascript學習演算法和資料結構(5) 首先，歡迎你來到演算法和資料結構系列文章的倒數第二篇，應該吧???凡事都不好說，哈哈。 此篇要介紹複雜許多的dijkstra algorithm(最短路徑演算法)，本來這篇會是這個系列的最後一篇(又是太天真)，但礙於內容長度的關係，就被拆成兩篇來寫，除了閱讀時間和篇幅不至於長到讓你棄讀或是直接放棄寫code(脫離 此篇幅大至分成 데이크스트라시 文字流程解說 데이크스트라 부호 圖解流程 데이크스트라 데이크스트라시 dijkstra這個演算法是用來在graph資料結構中找到任意起點到任意點的最短路徑。 在這個演算法中，我們會有三個class，分別是 node(value: 節點值、visited: 節點是否拜訪、edges: 存放該節點鄰近節點的陣列、distancefromstartnode: 該節點離起點的距離、previous: 該節點的上一個節點，以及一個用來增加該節點鄰近節.. 2022. 1. 11.
Javascript의 O.O. 객체 지향 프로그래밍은 단순히 다른 유형의 객체와 그 속성의 개념에 기반을 둔 프로그래밍 패턴이다. 지금은 거의 모든 프로그래밍 언어가 OOP를 지원하지만, 이 기사에서는 자바스크립트에서 OOP의 주요 특징에 대해 살펴보고 간단한 예를 들어 설명하겠습니다. 우리는 이러한 원칙을 예시하기 위해 자바스크립트에서 OOP의 핵심 특성을 사용하여 상속과 다형성 온베이스 수준을 살펴볼 것이다. 생성자 및 "this" 키워드. 자바스크립트의 객체 지향 프로그래밍과 다른 프로그래밍 언어에서 가장 필수적인 두 가지는 바로 이 키워드와 생성자이다. 자바스크립트 Es6+를 학습할 때 구문당이나 생성자를 작성하거나 클래스를 선언하는 더 편리한 방법으로 간주되지만, 이 글에서는 생성자가 후드 아래에서 어떻게 작동하는지 더 깊이.. 2022. 1. 11.
Apaitu Async Waiting, Promise, Callback — Handling Asyncronus javascript #1. 안녕하세요, 비주여기… 베베라파 개발자 멍킨 마시 케빙궁안 멘게나이 카라 핸들 단은 비동기크론 기능, 칼리이니 아칸 멤버리칸 펜젤라산 세카라 세데르하나를 소비합니다. Asyncronus secara sederhana sebuah sebuah concep dimana program akan menjalankan perlanjutnya tanpa menunggu kembalian perintah saati, silahkan baca lebih lebih lanjuth disuh disuh dis. 비동기 테르다팟 두아 마카암 야크니 멍구나칸 콜백 단 프로미스 처리. 콜백 아달라 수아투 페망길란 펑시 켐발리, untuk conto sederhana 마리 키타 디 코데 베리쿠트. Pertama kita memb.. 2022. 1. 11.
Angular 11 및 가 포함된 온라인 상점을 개발합니다.넷 코어 5 이 기사에서는 프로젝트에 권한을 부여합니다. 이는 이전 기사에서 살펴본 인증 기능을 보완한 것입니다. 이 시리즈의 첫 번째 게시물(이전 게시물에 대한 링크)을 여기에서 찾을 수 있습니다. 프런트엔드 먼저 권한 부여 등을 위한 도우미 클래스가 포함된 폴더(헬퍼)를 새로 추가합니다. helpers 폴더에 인터셉터 클래스를 만듭니다. 이 클래스는 모든 나가는 http 요청을 호출하는 단일 함수를 포함합니다(API에만 해당). 사용자가 로그인한 경우 이 함수는 요청 헤더에 JSON 웹 토큰을 추가합니다. 이 토큰은 인증 단계에서 백엔드에서 전송되었으며 이전 문서의 세션 저장소에 저장되었습니다. 토큰은 백엔드 API 미들웨어에 의해 검사되어 데이터 요청이 승인되었는지 여부를 결정합니다. app.module.ts에.. 2022. 1. 11.
색상으로 JavaScript Tic-Tac-Toe 게임을 만드는 방법 개요 틱택토 게임 방법 틱택토 게임 디자인 방법 HTML 파일 CSS 파일 Javascript 파일 게임 기능 끝. 개요 이 가이드는 컴퓨터에 대해 자신만의 틱 타코 견인을 만들고 플레이하는 방법을 가르쳐 줍니다. HTML, CSS, 자바스크립트 사용법을 배우게 될 것입니다. 가이드 작성 후 코딩 포트폴리오에서 이 프로젝트를 사용할 수 있습니다. 첫 번째 섹션에서는 틱택토 규칙을 안내합니다. 두 번째 섹션에서는 HTML 및 CSS 파일 설정을 안내합니다. 세 번째 절에서는 틱택토우를 위한 자바스크립트 코드를 안내합니다. HTML, CSS, 자바스크립트 사용법을 배우게 될 것입니다. 틱택토 게임 방법 색상 선택 보통 틱택토 게임에서 첫 번째 선수는 X이고 두 번째 선수는 O입니다. 그러나 이 버전의 틱택토.. 2022. 1. 11.
내가 지금까지 한 일 2부 (JS) 과거 블로그를 통해 현재 프로젝트를 진행하고 있는데, 이것이 제가 시간을 들여 작업한 것입니다. HTML, CSS, 자바스크립트로 만든 Roster`s의 간단한 메뉴입니다. 자바스크립트를 현대 영어로 번역할 때 경험이 부족해서 제가 설명하기가 좀 복잡할 것 같습니다. 제가 수탉 메뉴에 자바스크립트를 추가하는 것에 대해 설명하려고 하는 동안 양해해 주세요. 제가 만든 메뉴는 최대한 단순하면서도 우아한 느낌을 더하고 싶었습니다. 그래서 저는 간단한 메뉴를 만드는 대신 클릭할 때마다 페이드 인과 페이드 아웃을 애니메이션화하는 것을 추구했습니다. 이 애니메이션을 하기 위해서는 CSS와 JavaScript를 함께 만들어야 제대로 동작할 수 있었습니다. CSS 부분은 페이드인 및 페이드아웃의 원인이며, JavaSc.. 2022. 1. 11.
React성과 견고성을 갖춘 이더리움 트랜잭션 앱 구축 파트 1: 무엇을 만들 것인가. 여기서 라이브 데모와 Git Repo를 참조하십시오. 온라인 데모에서는 Ropsten 테스트 네트워크를 사용합니다. 도입 웹3 운동이 월드 와이드 웹에 파문을 일으키면서 개발자로 뛰어들어 이 블록체인 기술의 수혜자 중 한 명이 되어야 한다. 그런데 웹3가 뭐야? 블록체인 기반 탈중앙화가 적용된 월드 와이드 웹의 새로운 버전을 위한 개념이다. 즉, 데이터 자율성은 더 이상 한 개인이나 기업의 손에 넘어가지 않고 웹을 통해 배포될 것입니다. 다시 말해, 정보는 이제 네트워크를 통해 안전하고, 불변하며, 배포될 것입니다. 이 튜토리얼에서는 ReactJs 프런트엔드와 상호 작용할 분산형 블록체인 애플리케이션을 처음부터 구축하는 방법을 안내합니다. 2부작 시리즈 중 1부작으로, 여.. 2022. 1. 11.
자바스크립트에서 어떤 종류의 루프가 가장 빠릅니까? 어떤 루프 또는 반복기가 사용자의 요구에 적합한지 알아보고 앱 성능을 해치는 어리석은 실수를 방지하십시오. 웹 개발에서 자바스크립트는 새로운 센세이션을 일으키고 있다. NodeJS, React, Angular Vue 등과 같은 JS 프레임워크뿐만 아니라 바닐라 JS도 많은 팬층을 보유하고 있습니다. 이제 현대 자바스크립트에 대해 이야기해보자. 거의 모든 프로그래밍 언어는 루프를 사용한다. 현대 JS 언어는 가치에 대한 반복에 있어 많은 유연성을 제공합니다. 문제는, 어떤 루프와 반복이 당신의 요구에 가장 잘 맞는지 아는가 하는 것입니다. 루프에 대해 , for (reverse), for …of , foreach , for …in 및 for…wait 등 다양한 옵션을 사용할 수 있습니다. 그 기사는 그러한.. 2022. 1. 11.
JavaScript의 기본 VS 비기본/참조 유형 원시 대 원시적이지 않은 것의 차이와 작동을 5/분 안에 이해합시다. 기본 데이터 형식은 문자열, 숫자, 부울, 정의되지 않음, Null입니다. 비기본/참조 유형은 배열 , 객체, 함수입니다. 이제 먼저 이러한 값이 메모리에 저장되는 방법에 대해 알아보겠습니다. Primative 값은 Stack by value에 저장되고 non-primative 값은 참조로 저장됩니다. 변수 let name=" Humza "를 정의할 때 스택에 저장됩니다. 예를 들어 설명하겠습니다. 이제 출력은 "함자" 또는 "사지드"가 될 것 같습니까? 원시 값이 값으로 스택에 저장되므로 한 값이 변경되었을 때 다른 값에 영향을 미치지 않기 때문에 "함자"가 될 것이다. 힙 케이스에서는 어떤 일이 일어날까요? 힙은 크지만 속도가 느린.. 2022. 1. 4.

티스토리툴바