반응형 javascript3 💿 상태 패턴 🕹️ 상태 패턴이란객체의 상태를 조건문으로 검사해서 행위를 달리하는것이 아닌상태를 객체화 하여 상태가 행동할 수 있도록 위임하는 패턴.객체의 상태에 따라 행동을 변경videoPlayer를 상태패턴 만들기VideoPlay클래스를 통해 상태를 인자로 받고, setState를 통해 상태를 바꾸도록 한다class VideoPlay { constructor(state) { // Object.create를 통해 새로운 객체로 받고, Object.assign을 통해 객체복사를 진행한다 this.state = Object.create(Object.assign({ videoplayer: this }, state)); } setState(state) { this.state = Object.creat.. 2024. 11. 25. 🦘비디오 자동재생 실행시키기 🐅 비디오 정책 크롬이나 사파리등 사용자의 액션없이 비디오를 자동재생 시킬 수는 없다. 다만 자동재생이 필요한 경우 음소거 처리하면 자동실행이 가능하다 그러나 현재 서비스에서는 항상 자동재생을 원하였다. 다만 항상 자동재생을 할 수 없다고 전달하였고, 자동재생이 안될 경우 alert을 띄어주기로 하였다 🦬 자동재생 시도 여전히 사용자 액션없이는 자동재생이 거의불가능 하지만 시도 할 수 있는 방법이 존재한다. 3회에 걸쳐 강제로 play를 하는것이며, 안될경우 alert으로 사용자가 재생버튼을 누르도록 유도한다. 🐘 자동재생 시도 - script 일단 video retry를 Promise 형태로 return 한다. /* promise retry video*/ const videoPromiseRetry = .. 2023. 7. 2. 👏 렉시컬 스코프 & 클로저 🤲 렉시컬 스코프 자바스크립트 엔지는 함수를 어디서 호출했는지가 아니라 함수를 어디서 정의했는지에 따라서 상위스코프가 정해진다. 이것을 렉시컬 스코프라고 한다 => 이것을 말만 하면 이해가 할 수 없다. 예제를 통해서 알아보자 const x = 1; function foo() { const x = 10; console.log(x); bar(); //1 } function bar() { console.log(x); } foo(); // 10 bar(); // 1 foo 함수 안에서 bar 함수를 호출하였지만, 결과는 1이 나온다. 왜냐하면 bar함수가 정의되는 곳이 foo함수 안이 아니기 때문에 foo함수의 상위 스코프는 전역함수이고 전역함수의 x=1이다. const x = 1; function outer.. 2023. 3. 7. 이전 1 다음 반응형