├── README.md └── topics ├── closures.md ├── complex.md ├── flow.md ├── hoisting-vs-types.md ├── inheritance-vs-context.md ├── passing-by-value-and-by-reference.md ├── quirks.md └── wft.md /README.md: -------------------------------------------------------------------------------- 1 | # JS interview questions 2 | 3 | Repo with notes from/for interviews for js-developer positions. 4 | 5 | - [Passing by value/reference](https://github.com/vvscode/js--interview-questions/blob/master/topics/passing-by-value-and-by-reference.md) 6 | - [Closures](https://github.com/vvscode/js--interview-questions/blob/master/topics/closures.md) 7 | - [Flow](https://github.com/vvscode/js--interview-questions/blob/master/topics/flow.md) 8 | - [Hoisting and types](https://github.com/vvscode/js--interview-questions/blob/master/topics/hoisting-vs-types.md) 9 | - [Inheritance and context](https://github.com/vvscode/js--interview-questions/blob/master/topics/inheritance-vs-context.md) 10 | - [Complex](https://github.com/vvscode/js--interview-questions/blob/master/topics/complex.md) 11 | - [Quirks](https://github.com/vvscode/js--interview-questions/blob/master/topics/quirks.md) 12 | - [WTF](https://github.com/vvscode/js--interview-questions/blob/master/topics/wft.md) 13 | - [Greate list of framework specific (not only js) questions](https://www.toptal.com/resources) 14 | - [Unlocking the JavaScript Code Interview (an Interviewer Perspective)](https://medium.com/appsflyer/unlocking-the-javascript-code-interview-an-interviewer-perspective-f4fe06246b29) 15 | 16 | --- 17 | 18 | Here I've noted only questions from my interviews. 19 | 20 | ## If you want to get more information/materials check next repos: 21 | 22 | - https://github.com/h5bp/Front-end-Developer-Interview-Questions -- not only about js 23 | - https://github.com/nishant8BITS/123-Essential-JavaScript-Interview-Question 24 | - https://github.com/kolodny/exercises Some basic javascript coding challenges and interview questions 25 | - https://github.com/malachaifrazier/JavaScript-Interview-Questions Common Questions that may be Asked on a Job Interview 26 | - https://github.com/adam-s/js-interview-review What Do I Need to Know to Ace a JavaScript Interview? 27 | - https://github.com/mi-lee/js-interview-questions/blob/master/interview-questions.md 28 | - https://github.com/nathansmith/javascript-quiz 29 | - https://github.com/ChiperSoft/InterviewThis An open source list of developer questions to ask prospective employers 30 | - https://github.com/MaximAbramchuck/awesome-interview-questions Awesome Interviews ( multiple langs ) 31 | - https://github.com/apoterenko/javascript-interview-questions ( about 50 questions like "Explain ouput.." 32 | - https://github.com/kensterz/interview-questions-in-javascript Interview Algorithm Questions in Javascript 33 | - https://github.com/HIROSN/coding-interviews-es6 Coding Interview Questions (ECMAScript 2015) 34 | - https://github.com/mkshen/code-problems-solutions Interview coding questions and answers in Javascript - ES6 35 | - https://github.com/khan4019/front-end-Interview-Questions Interview Questions for front-end-Developer ( Only for JS developer when they have to answer some side questions to make interviewer comfortable. ) by [That JsDude](http://www.thatjsdude.com/interview/index.html) 36 | - https://medium.com/javascript-scene/10-interview-questions-every-javascript-developer-should-know-6fa6bdf5ad95#.i5mgmc4m0 10 Interview Questions Every JavaScript Developer Should Know AKA: The Keys to JavaScript Mastery 37 | - https://github.com/yangshun/tech-interview-handbook/blob/master/front-end/interview-questions.md - Front-end Job Interview Questions (and **Answers** - that might be most interesting for lazy persons who just want to know keys for interview ) 38 | - https://github.com/wwwebman/front-end-interview-questions Our front end interview questions and answers can help you to prepare for an interview better and faster 39 | - https://github.com/kennymkchan/interview-questions-in-javascript A mostly reasonable collection of technical software development interview questions solved in Javascript 40 | - https://github.com/fejes713/30-seconds-of-interviews A curated collection of common interview questions to help you prepare for your next interview. 41 | - https://github.com/rakesh-sankar/awesome-interview-question A curated list of interview questions of various domain. 42 | - https://github.com/ajzawawi/js-interview-prep A collection of JS interview questions ~~updated every day~~ 43 | - https://github.com/monkey3310/full-stack-interview Full Stack Interview Questions & Answers (inc. js-stack) 44 | - https://github.com/sudheerj/reactjs-interview-questions List of top 222 ReactJS Interview Questions & Answers 45 | - https://github.com/Pau1fitz/react-interview List of common React interview questions. 46 | - https://github.com/ElemeFE/node-interview How to pass the Node.js interview of ElemeFE 47 | - https://www.adaface.com/blog/react-interview-questions/ 100+ React Interview Questions (2020) 48 | 49 | ## More specific questions: 50 | 51 | - [Top 50 React Interview Questions You Must Prepare In 2019](https://www.edureka.co/blog/interview-questions/react-interview-questions/) 52 | - [5 Essential React.js Interview Questions](https://www.codementor.io/reactjs/tutorial/5-essential-reactjs-interview-questions) 53 | - [(one more time ) Awesome Interviews - not only languages, but libraries/frameworks too](https://github.com/MaximAbramchuck/awesome-interview-questions) 54 | - JS Interview Algorithm [beginner](http://www.thatjsdude.com/interview/js1.html) / [intermediate](http://www.thatjsdude.com/interview/js2.html) 55 | - [13 Essential React.js Interview Questions](https://www.toptal.com/react/interview-questions) 56 | - [React Interview Questions and Answers](https://www.interviewbit.com/react-interview-questions/) 57 | 58 | ## Also it may be helpful to check next books: 59 | 60 | - **"Javascript Technical Interview Questions"** by Xuanyi Chew https://leanpub.com/jsinterviewquestions 61 | - **"Quick JavaScript Interview Questions"** by Sandeep Kumar Patel https://leanpub.com/quickjavascriptinterviewquestions 62 | - **"JavaScript Interview Questions: Who Else Wants to Nail that Interview?"** by Volkan Özçelik https://o2js.com/assets/javascript-interview-questions.pdf 63 | - https://www.frontendhandbook.com/practice/interview-q.html The part about interview at `Front-End Developer Handbook` 64 | - http://www.w3resource.com/javascript-exercises/ JavaScript Exercises, Practice, Solution ( starter level, suppose. Most questions is about knowledge of basic API / lang construction ) 65 | - https://www.interviewcake.com/javascript-interview-questions ( JavaScript Interview Questions, like "Merging Meeting Times", "Two Egg Problem" -- the exersizes/questions can be solved no only via js - they are more algorithmic and give you mental pabulum ). Both - tasks/solutions are pretty cool 66 | - https://github.com/yangshun/tech-interview-handbook **Tech Interview Handbook** (Algorithms, front end and behavioral content for rocking your coding interview) 67 | 68 | ## Some ideas can be found during online tests. Like next: 69 | 70 | - https://tests4geeks.com/category/javascript 71 | - http://perfectionkills.com/javascript-quiz-es6/ ( also check explains at https://gist.github.com/DmitrySoshnikov/3928607cb8fdba42e712 ) 72 | - http://dmitry.baranovskiy.com/post/91403200 - So, you think you know JavaScript? it's usefull to read https://www.nczonline.net/blog/2010/01/26/answering-baranovskiys-javascript-quiz/ ) 73 | - http://perfectionkills.com/javascript-quiz/ 74 | - https://www.adaface.com/assessment-test/javascript-online-test 75 | 76 | ## You can get more practice in interview questions at: 77 | 78 | - https://codesignal.com/interview-practice 79 | - https://www.pramp.com 80 | - https://interviewbuddy.in 81 | - http://www.gainlo.co 82 | 83 | If you're ready to share your experience - you're welcome. Make PR to related file ( by topic ) or create issue with list of questions 84 | 85 | **_P.S._** it worth to check **_*'Cracking the Coding Interview'*_** by Gayle Laakmann McDowell ( solutions can be founded at https://github.com/careercup/CtCI-6th-Edition , book (at least 5th edition can be googled ) 86 | -------------------------------------------------------------------------------- /topics/closures.md: -------------------------------------------------------------------------------- 1 | # Closures 2 | 3 | What is the output? ( How make it correct ) 4 | 5 | 6 | ```javascript 7 | for (var i = 0; i < 5; i++) { 8 | setTimeout(function() { 9 | console.log(i); 10 | }, 1000); 11 | } 12 | ``` 13 | 14 | --- 15 | What is the output? 16 | 17 | ```javascript 18 | var func = []; 19 | for (var i = 0; i < 5; i++) { 20 | func[i] = function() { 21 | console.log(i); 22 | }; 23 | } 24 | func[3](); 25 | ``` 26 | 27 | --- 28 | What is the output? 29 | 30 | ```javascript 31 | (function() { 32 | var a = b = 5; 33 | })(); 34 | console.log(b); 35 | ``` 36 | 37 | --- 38 | Create code for next conditions 39 | 40 | ```javascript 41 | function calculate() {/* put your code here */} 42 | calculate('+')(1)(2); // 3 43 | calculate('*')(2)(3); // 6 44 | ``` 45 | 46 | --- 47 | Create code for next conditions 48 | 49 | ```javascript 50 | var sum = function() { /* put your code here */}; 51 | var s = sum(); 52 | alert(s); // 0 53 | alert(s(1)); // 1 54 | alert(s(1)(2)); //3 55 | alert(s(3)(4)(5)); // 12 56 | ``` 57 | 58 | 59 | ## lighter version might use `sum(1)(2)()` with empty `()` at the end 60 | 61 | What is the output? 62 | 63 | 64 | ```javascript 65 | (function(x) { 66 | return (function(y) { 67 | console.log(x); 68 | })(2) 69 | })(1); 70 | ``` 71 | 72 | --- 73 | What do next code do? 74 | 75 | ```html 76 | 77 | 78 | 79 | 89 | ``` 90 | 91 | --- 92 | what output will be? 93 | 94 | ```javascript 95 | const fn = () => { 96 | let a = 1; 97 | return () => { 98 | a++; 99 | return a; 100 | } 101 | }; 102 | const fnRes = fn(); 103 | alert(fnRes()); 104 | alert(fnRes()); 105 | 106 | const fnRes2 = fn(); 107 | alert(fnRes2()); 108 | alert(fnRes2()); 109 | ``` 110 | 111 | --- 112 | 113 | 114 | ```javascript 115 | /* 116 | - Do you understand the closure? 117 | - Yes! 118 | - Write a function, that does this next: 119 | */ 120 | const func = (a, b, c, d, e) => a + b + c + d + e; 121 | 122 | const hof = yourFunction(func); 123 | 124 | console.log(hof(1, 2, 3, 4, 5)); // 15 125 | console.log(hof(2, 3, 4)(5, 6)); // 20 126 | console.log(hof(3, 4)(5, 6)(7)); // 25 127 | console.log(hof(4, 5)(6)(7, 8)); // 30 128 | console.log(hof(5)(6)(7)(8)(9)); // 35 129 | ``` 130 | 131 | -------------------------------------------------------------------------------- /topics/complex.md: -------------------------------------------------------------------------------- 1 | # Complex 2 | 3 | Spiral output for array 4 | 5 | 6 | ```javascript 7 | var m = [ 8 | [0, 1, 2, 3, 4], 9 | [5, 6, 7, 8, 9], 10 | [10, 11, 12, 13, 14], 11 | [15, 16, 17, 18, 19] 12 | ]; 13 | 14 | var spiral = function (m) { 15 | // Put your code here 16 | }; 17 | ``` 18 | 19 | 20 | Should be `[0, 1, 2, 3, 4, 9, 14, 19, 18, 17, 16, 15, 10, 5, 6, 7, 8, 13, 12, 11]` 21 | 22 | --- 23 | 24 | Sort array with semver-rules 25 | 26 | 27 | ```javascript 28 | var arr = [ "1.0.5", "2.5.0", "0.12.0", "1", "1.23.45", "1.4.50", "1.2.3.4.5.6.7"]; 29 | 30 | function semverSor() { 31 | // put your code here 32 | } 33 | 34 | semverSor(arr); 35 | ``` 36 | 37 | 38 | Like `[ "0.12.0", "1", "1.0.5", "1.2.3.4.5.6.7", "1.4.50", "1.23.45", "2.5.0" ]` 39 | 40 | --- 41 | 42 | Implement deepClone ( withour recursive links and functions 43 | Simpliest , suppose is JSON.parse(JSON.stringify(m)) but we need real code =) 44 | 45 | --- 46 | 47 | Implement bind(func, context). Make polyfill .bind(context) 48 | 49 | --- 50 | 51 | Check if string is anagramm ( start-to-end is the same as end-to-start) 52 | Like `ololo`. 53 | Option -- the same without spaces like `olo lo` 54 | Option - the same in functional style 55 | 56 | --- 57 | 58 | We have next stub 59 | Fill blank methods to describe algorithms for servicing multistory building with your elevator. 60 | You have only low-leve intarface (HardwareElevator) with three states - stoppes, move up, move down. 61 | Every floor has two buttons up/down 62 | Inside cabin there are only buttons with numbers 63 | 64 | 65 | ```javascript 66 | DIRECTION_DOWN = -1 67 | DIRECTION_NONE = 0 68 | DIRECTION_UP = 1 69 | 70 | function HardwareElevator(){}; 71 | HardwareElevator.prototype = { 72 | moveUp:function(){console.log('moving up');}, 73 | moveDown:function(){console.log('moving down');}, 74 | stopAndOpenDoors:function(){console.log('stopping and opening doors');}, 75 | getCurrentFloor:function(){console.log('getting current floor');}, 76 | getCurrentDirection:function(){console.log('getting current drection');} 77 | } 78 | 79 | function Elevator() { 80 | this.hw = new HardwareElevator(); 81 | this.hw.addEventListener("doorsClosed", _bind(this.onDoorsClosed, this)); 82 | this.hw.addEventListener("beforeFloor", _bind(this.onBeforeFloor, this)); 83 | } 84 | Elevator.prototype = { 85 | onDoorsClosed: function(floor) { 86 | // put your code here 87 | }, 88 | onBeforeFloor: function(floor, direction) { 89 | // put your code here 90 | }, 91 | floorButtonPressed: function(floor, direction) { 92 | // put your code here 93 | }, 94 | cabinButtonPressed: function(floor) { 95 | // put your code here 96 | } 97 | } 98 | ``` 99 | 100 | --- 101 | Implement chain map-method which can work with async functions ( promises-based ) 102 | Like: 103 | 104 | ```javascript 105 | Chain([link1,link2,link3]).mapAsync(link => get(link)).mampAsync(page => printPage) 106 | ``` 107 | 108 | --- 109 | Write code which will output itself into console/document 110 | --- 111 | We want to write calculations using functions and get the results. Let's have a look at some examples: 112 | 113 | ```javascript 114 | seven(times(five())); // must return 35 115 | four(plus(nine())); // must return 13 116 | eight(minus(three())); // must return 5 117 | six(dividedBy(two())); // must return 3 118 | ``` 119 | 120 | 121 | Requirements: 122 | 123 | - There must be a function for each number from 0 ("zero") to 9 ("nine") 124 | - There must be a function for each of the following mathematical operations: plus, minus, times, dividedBy (divided_by in Ruby) 125 | - Each calculation consist of exactly one operation and two numbers 126 | - The most outer function represents the left operand, the most inner function represents the right operand 127 | 128 | --- 129 | 130 | Написать функцию котороя будет разворачивать буквы в словах предложения, но только лишь буквы цифры и специальные символы должны остаться на месте 131 | 132 | ``` 133 | 134 | // s1tar3t 2 hellow -> t1rat3s 2 wolleh 135 | // s1ta$%r3t 2 hel^low -> t1ra$%t3s 2 wol^leh 136 | // s1tar3t 2 low5 -> t1rat3s 2 wol5 137 | ``` 138 | 139 | ## 140 | 141 | Реализовать фукнционал, допускающий следующий код 142 | 143 | 144 | ```javascript 145 | (3).add(5).multiply(2) // 16 146 | ``` 147 | 148 | 149 | Нужно реализовать следующие методы 150 | 151 | - add 152 | - subtract 153 | - multiply 154 | - divide 155 | - square 156 | - После должна появится возможность выстраивать команды в цепочку ( см пример выше ) 157 | 158 | --- 159 | 160 | Implement simple module system with injection system like in angular 161 | 162 | 163 | ```javascript 164 | function($moduleName, $anotherModuleName){} 165 | ``` 166 | 167 | 168 | should get objects from `module('moduleName') / module(anotherModuleName)` 169 | 170 | --- 171 | 172 | Output? 173 | 174 | 175 | ```javascript 176 | var f = (function f(){ return "1"; }, function g(){ return 2; })(); 177 | typeof f; 178 | ``` 179 | 180 | --- 181 | Output? 182 | 183 | ```javascript 184 | var text = 'outside'; 185 | function logIt(){ 186 | console.log(text); 187 | var text = 'inside'; 188 | }; 189 | logIt(); 190 | ``` 191 | 192 | --- 193 | Game where everyone win. Output? 194 | 195 | ```html 196 | 197 | 198 | 199 | 209 | ``` 210 | 211 | --- 212 | Define a spacify function which takes a string as an argument, and returns the same string but with each character separated by a space 213 | - `spacify('hello world') // => 'h e l l o w o r l d'` 214 | - `'hello world'.spacify() // => 'h e l l o w o r l d'` 215 | --- 216 | Write a program that prints all the numbers from 1 to 100. For multiples of 3, instead of the number, print "Fizz", for multiples of 5 print "Buzz". For numbers which are multiples of both 3 and 5, print "FizzBuzz". 217 | 218 | Option: do it without conditional statements (if/switch/?:) 219 | Option: do not use logical operators (&& / ||) 220 | Option: do not use loops (for/do/while/etc) 221 | --- 222 | Create lazy-evaluations POC 223 | 224 | ```javascript 225 | var le = new LazyEval([1, 2, 3, 4, 5]) 226 | .filter(i => i > 2) 227 | .map(i => i * 2); 228 | le.value(); // [6, 8, 10] 229 | ``` 230 | 231 | 232 | _BUT!_ all evaluations should be done only after .value() call 233 | 234 | --- 235 | 236 | Create .bind method for function without using .call/.apply (only trash, only hardcore) 237 | 238 | --- 239 | 240 | Create compose function 241 | 242 | 243 | ```javascript 244 | const compose = (f1, f2) => value => f1( f2(value) ) 245 | ``` 246 | 247 | 248 | - list of functions can has any length 249 | - for zero-length list it should return `() => undefined` 250 | `compose(fn, fn1, fn2, fn3)` ... etc 251 | 252 | --- 253 | 254 | Implement `.map` using `.reduce` for iteration ( for arrays ) 255 | 256 | --- 257 | 258 | Fnd average age for male-users 259 | 260 | 261 | ```javascript 262 | var users = { 263 | 'Bob': { age: 24, isMale: true }, 264 | 'Sam': { age: 23, isMale: true }, 265 | 'Mag': { age: 54, isMale: false }, 266 | 'Ken': { age: 43, isMale: true }, 267 | 'Marta': { age: 34, isMale: false }, 268 | 'Duglas': { age: 27, isMale: true }, 269 | 'Martin': { age: 34, isMale: true }, 270 | }; 271 | ``` 272 | 273 | 274 | --- 275 | 276 | **Challenge:** Implement a tic-tac-toe game (3x3) 277 | 278 | **Requirements:** 279 | 280 | 1. program must be a pure JavaScript solution. not looking for a web application here 281 | 1. program must play a game for both players with no user interaction 282 | 1. program must display the game board after each player move 283 | 1. program must display the game winner, or 'draw' if not won 284 | 285 | **Notes:** 286 | 287 | 1. program does not have to choose a player move intelligently 288 | 1. don't bother drawing lines for the game board 289 | 1. feel free to use underscore/lodash if you like 290 | 1. feel free to use es6/es2015 features if you like 291 | 292 | Begin when ready, and remember to verbalize your design and implementation thoughts as you proceed. 293 | 294 | --- 295 | 296 | About promises: 297 | 298 | - Suppose findData is a function that takes a query object and returns a promise for the result of the query. 299 | - Suppose also that someRandomArrayOfQueries is an array of query objects. 300 | 301 | --- 302 | 303 | Explain what would be printed by the following code and why 304 | 305 | 306 | ```javascript 307 | function runMultipleQueries(queries) { 308 | var results = []; 309 | queries.forEach(doQuery); 310 | return results; 311 | 312 | function doQuery(query) { 313 | findData(query) 314 | .then(results.push.bind(results)); 315 | } 316 | } 317 | function log(value) { 318 | console.log(value); 319 | } 320 | runMultipleQueries(someRandomArrayOfQueries).forEach(log); 321 | ``` 322 | 323 | 324 | --- 325 | 326 | Create code to pass test ( mocha, but it doesn't metter ) 327 | 328 | 329 | ```javascript 330 | describe('Step 5', function() { 331 | it('add(2,8)(5).value() => 15', function() { 332 | add(2,8)(5).value() 333 | .should.be.exactly(15).and.be.a.Number; 334 | }); 335 | it('add(3, 3, 5)(4)(3, 2).value() => 20', function() { 336 | add(3, 3, 5)(4)(3, 2).value() 337 | .should.be.exactly(20).and.be.a.Number; 338 | }); 339 | }); 340 | ``` 341 | 342 | 343 | --- 344 | 345 | Given two identical DOM trees (not the same one), and a node from one of them find the node in the other one. 346 | 347 | --- 348 | 349 | What is the difference between these four promises? 350 | 351 | 352 | ```javascript 353 | doSomething().then(function () { 354 | return doSomethingElse(); 355 | }); 356 | 357 | doSomething().then(function () { 358 | doSomethingElse(); 359 | }); 360 | 361 | doSomething().then(doSomethingElse()); 362 | 363 | doSomething().then(doSomethingElse); 364 | ``` 365 | 366 | 367 | --- 368 | 369 | Implement function to remove duplication from list (array) 370 | 371 | --- 372 | 373 | You have a function `rand7()` that generates a random integer from 1 to 7. 374 | Use it to write a function `rand5()` that generates a random integer from 1 to 5. 375 | 376 | - rand7() returns each integer with equal probability. 377 | - rand5() must also return each integer with equal probability. 378 | 379 | --- 380 | 381 | For next markup 382 | 383 | 384 | ```html 385 |
Select me!
386 | ``` 387 | 388 | 389 | create js code ( via native js ) which on click at div will select all text inside 390 | note - just check range/selection api 391 | 392 | --- 393 | 394 | A polindromic number reads the same both ways. 395 | The largest polindrome made from the product of two 2-digit numbers is 9009 = 91\*99. 396 | Find the largest polindrom made from the product of two 3-digit numbers. 397 | 398 | --- 399 | 400 | Given an input string, you should check if the string contains the same amount of 'x' and 'o'. The case doesn't matter - if the amount is equal, return a true otherwise return false. 401 | 402 | 403 | ```javascript 404 | describe('sameXOAmount()', () => { 405 | it('should return `true` if number of `X` and `O` is equal', () => { 406 | expect(sameXOAmount('xXoO')).toEqual(true); 407 | expect(sameXOAmount('aAxXXbBoOo')).toEqual(true); 408 | expect(sameXOAmount('abc')).toEqual(true); 409 | }); 410 | it('should return `false` if number of `X` and `O` is not equal', () => { 411 | expect(sameXOAmount('OaAxXbBoO')).toEqual(false); 412 | expect(sameXOAmount('xgXoXsdxOxz')).toEqual(false); 413 | expect(sameXOAmount('aaAmmMxMM')).toEqual(false); 414 | }); 415 | }); 416 | ``` 417 | 418 | 419 | --- 420 | 421 | Given an array of numbers, you should find the number which occurs an odd number of times within the array. 422 | You can assume that there is always just one number with an odd amount. 423 | Furthermore the array is never undefined and contains only numbers. 424 | 425 | 426 | ```javascript 427 | describe('findOddAmount()', () => { 428 | it('should return the number which occurs with an odd frequency', () => { 429 | expect(findOddAmount([1, 2, 2, 3, 3])).toEqual(1); 430 | expect(findOddAmount([8, 8, 7, 7, 7])).toEqual(7); 431 | expect(findOddAmount([10, 3, 3, 10, 6, 10, 6, 1, 1])).toEqual(10); 432 | }); 433 | }); 434 | ``` 435 | 436 | 437 | --- 438 | 439 | Create `uniq` function, witch takes a list and returns only uniq values from list. Like in lodash/underscore 440 | 441 | --- 442 | 443 | Let imaging sequence `1010010001000010000010000001...` `(k(1->oo) "1{0xk}"`. Create function which takes number of symbols as an argument and returns n-first symbols of the sequence 444 | 445 | --- 446 | 447 | Create `.bind` polyfill without using `.call`/`.apply` ( really tricky task, but it gives food for dicussion ) 448 | 449 | --- 450 | 451 | Based on list of chars, find the longes polindrome ( string equal in both directions: rtl = ltr ) like ['a', `'b', 'c', 'a', 'b', 'd'] => 'abcba' / 'abdba'` 452 | 453 | --- 454 | 455 | Implement shuffle(list) function which suffle list ( randomize list elements ) 456 | 457 | --- 458 | 459 | Create Promise implementation 460 | 461 | NB: In fact it was pair programmng session but it could be meditative task, wich takes as much time as you have. It covers a lot of topics - async / flow / thenable-interface / functions / exceptions etc. 462 | 463 | --- 464 | 465 | 466 | ```javascript 467 | ar arr = [1,2,42,3]; 468 | var brr = []; 469 | 470 | for (var i = 0; i < arr.length; i++) { 471 | if (arr[i] === 42) { 472 | // fill it as short as possible 473 | // to get brr equal to [1,2,3] 474 | } 475 | 476 | brr.push(arr[i]); 477 | } 478 | ``` 479 | 480 | 481 | --- 482 | 483 | Write a `matchSum(list, targetValue)` function. Which takes list of numbers and target sum and returns pair of elements which gives target sum. 484 | 485 | ``` 486 | 487 | matchSum([4, 7, 1, 8, 9], 11); // [4, 7] 488 | ``` 489 | 490 | 491 | 492 | - what if you need return all pairs? 493 | - could you implement linear complexity ? 494 | 495 | --- 496 | 497 | Write your out `trim()` function (obviously - do not use `String.prototype.trim`). Extended: create `trim('zxc')` function which takes list of symbols to trim. 498 | 499 | --- 500 | 501 | Are you familiar with common.js modules? When inside module we are able to use `module` / `exports` ? _( what's the difference in usage `module.exports` / `exports` ?) )_ Please implement your own `require` function with the same functionality, as original. 502 | 503 | --- 504 | 505 | **Light version**: Write a function checking that the given string is valid. We consider a string 506 | to be valid if all the characters of the string have exactly the same frequency. 507 | 508 | Examples: 509 | 510 | - `aabbcc` is a valid string 511 | - `aabbccc` is an invalid string 512 | 513 | **Extended version**: Check if the string is valid as it is (same condition as before) or if **one** character 514 | at one position can be removed from the string so it will become valid. 515 | 516 | Examples: 517 | 518 | - `aabbcc` -> **true** 519 | - `aabbcccc` -> **false** 520 | - `aabbccf` -> **true** 521 | - `aaabbbcccf` -> **true** 522 | - `aabbccc` -> **true** 523 | - `abcddff` -> **false** 524 | - `abcdefffff` -> **false** 525 | - `aabbccddd` -> **true** 526 | 527 | --- 528 | 529 | Again about brackets. 530 | 531 | Easy part: 532 | 533 | - '(', '{', '[' are called "openers". 534 | - ')', '}', ']' are called "closers". 535 | Write an efficient function that tells us whether input string's openers 536 | and closers are properly nested. 537 | 538 | Examples: 539 | 540 | ``` 541 | 542 | "{ [ ] ( ) }" -> true 543 | "{ [ ( ] ) }" -> false 544 | "{ [ }" -> false 545 | "class Example { public do() { return; } }" -> true 546 | "class Example { public do( { return; } }" -> false 547 | ``` 548 | 549 | 550 | 551 | Extra: handle also next types of brackes 552 | 553 | ``` 554 | 555 | <> 556 | '' 557 | || 558 | ``` 559 | 560 | 561 | 562 | There might be multiple ways how to interpret lines `''''` (`'('')'` or `('')('')`) - in my concrete situation we agreed that we're closing bracket everytime we can. It influences to the cases like `'"'||'"'` which we interpret like `'("('(||)')")'` 563 | 564 | Tests we agreed during an interview: 565 | 566 | 567 | ```javascript 568 | test('', true); 569 | test('some', true); 570 | test('(', false); 571 | test('()', true); 572 | test('()[', false); 573 | test('()[]', true); 574 | test(')', false); 575 | test('([)]', false); 576 | test('((', false); 577 | test('())', false); 578 | 579 | test('class Example { public do() { return; } }', true); 580 | test('class Example { public do( { return; } }', false); 581 | 582 | test("('['", false); 583 | test("(')'", false); 584 | test('("("[]")")', true); 585 | test("(')'", false); 586 | test("'||'''", true) 587 | ``` 588 | 589 | 590 | --- 591 | 592 | Your task is to embed a third-party video player library called SimplePlayer 593 | into your application. 594 | Here is an extract from the SimplePlayer API documentation: 595 | 596 | ``` 597 | 598 | CLASS: 599 | SimplePlayer 600 | 601 | CONSTRUCTOR: 602 | new SimplePlayer(manifestUri) 603 | where manifestUri is the URI of video stream manifest 604 | 605 | METHODS: 606 | play() 607 | initiate playback of video stream 608 | pause() 609 | pause playback of video stream 610 | getPlaybackStatus() 611 | get the playback status of the current video stream, returns a 612 | one of the following strings: "PLAYING", "STOPPED" or "BUFFERING" 613 | addPlaybackStatusListener(callback) 614 | allows a callback to be set that is executed whenever 615 | the playback status changes. The playback status ("PLAYING", "STOPPED" 616 | or "BUFFERING") is passed to the callback as the only argument. 617 | ``` 618 | 619 | 620 | 621 | QUESTIONS: 622 | 623 | 1. Create a basic test application in your chosen programming language that 624 | performs the following functions: 625 | 626 | a) creates an instance of SimplePlayer 627 | 628 | b) invokes the play command 629 | 630 | c) logs the playback status to the console 631 | 632 | 2. Extend the code you have written with a "bufferMonitor" function which prints 633 | "too much buffering" to the console when the player is buffering continuously 634 | for more than one minute 635 | 3. If necessary refactor your code so that it is possible to unit test the 636 | bufferMonitor function (without mocking of setTimeout via testing frameworks and using of fake timers), then write appropriate unit tests. 637 | 638 | --- 639 | 640 | Given a string S consisting of lowercase English characters determine if you can make it a palindrome by removing at most 1 character. 641 | 642 | ``` 643 | 644 | tacocats -> tacocat 645 | racercar -> racecar or racrcar 646 | kbayak -> kayak 647 | acbccba -> abccba 648 | abccbca -> abccba 649 | ``` 650 | 651 | 652 | -------------------------------------------------------------------------------- /topics/flow.md: -------------------------------------------------------------------------------- 1 | # Flow 2 | 3 | What is the output? 4 | 5 | 6 | ```javascript 7 | console.log(1); 8 | setTimeout(function() { 9 | console.log(2); 10 | }, 1000); 11 | setTimeout(function() { 12 | console.log(3); 13 | }, 0); 14 | console.log(4); 15 | ``` 16 | 17 | --- 18 | What is the output? 19 | 20 | ```javascript 21 | function say(a) { 22 | alert(a); 23 | } 24 | say(1); 25 | setTimeout(say(2), 5000); 26 | setTimeout(function() { 27 | say(3); 28 | }, 1000); 29 | setTimeout(say, 2000, 4); 30 | ``` 31 | 32 | --- 33 | What's wrong? How fix? 34 | 35 | ```javascript 36 | var done = false; 37 | $.ajax(url, function() { 38 | done = true; 39 | }); 40 | while (!done) { 41 | someWaitingStuff(); 42 | } 43 | ``` 44 | 45 | --- 46 | Next code print `0,1,2,3,4,4,3,2,1,0` 47 | Modify only functions ( not loops ) to get output as `4,3,2,1,0,0,1,2,3,4` 48 | 49 | ```javascript 50 | var a = function(i) { 51 | console.log(i); 52 | }; 53 | var b = function(i) { 54 | console.log(i); 55 | }; 56 | for (var i = 0; i < 5; i++) { 57 | a(i); 58 | } 59 | for (var i = 4; i >= 0; i--) { 60 | b(i); 61 | } 62 | ``` 63 | 64 | --- 65 | The following recursive code will cause a stack overflow if the array list is too large. 66 | How can you fix this and still retain the recursive pattern? 67 | 68 | ```javascript 69 | var list = readHugeList(); 70 | var nextListItem = function() { 71 | var item = list.pop(); 72 | if (item) { 73 | // process the list item... 74 | nextListItem(); 75 | } 76 | }; 77 | ``` 78 | 79 | --- 80 | What is the output 81 | 82 | ```javascript 83 | (function() { 84 | console.log(1); 85 | setTimeout(() => console.log(2), 1000); 86 | setTimeout(() => console.log(3), 0); 87 | Promise.resolve(true).then(() => console.log(4)); 88 | console.log(5); 89 | })(); 90 | ``` 91 | 92 | --- 93 | Create fetcher function, which takes url, and number of tryies to re-fetch data in case of error. 94 | You can use any load-interface ( fetch/xhr/... ) 95 | 96 | Bonus: Implement in both styles - recursion / non-recursion 97 | 98 | --- 99 | What is the output 100 | 101 | ```javascript 102 | try { 103 | setTimeout(function() { 104 | throw new Error(); 105 | }, 1000); 106 | } catch (e) { 107 | alert( e); 108 | } 109 | ``` 110 | 111 | 112 | --- 113 | 114 | Create `promisify` function which takes node-style (error-first) function and converts it into promise-based function. 115 | Instead of calling callback with error, data it return promise which resolves/rejectes. It worth to check if function save context for original function (`this`) 116 | 117 | --- 118 | 119 | Create function for asyn serial list processing. Takes list and callback `(element, index, list, doneCb)`. Returns promise wich resolved with results. Add callbacks should be called one by one. 120 | 121 | 122 | ```javascript 123 | serialProcess([1,2,3,4,5], (el, index, list, done) => { 124 | console.log(`${el} start`); 125 | setTimeout(() => { 126 | console.log(`${el} end`); 127 | done(el*el); 128 | }, el*100); 129 | }).then((list) => console.log(list)); // [1,4,9,16,25] 130 | ``` 131 | 132 | 133 | in callback style 134 | 135 | 136 | ```javascript 137 | serialProcess( 138 | [1,2,3,4,5], 139 | (el, index, list, done) => { 140 | console.log(`${el} start`); 141 | setTimeout(() => { 142 | console.log(`${el} end`); 143 | done(el*el); 144 | }, el*100); 145 | }, 146 | (list) => console.log(list) 147 | ); // [1,4,9,16,25] 148 | ``` 149 | 150 | -------------------------------------------------------------------------------- /topics/hoisting-vs-types.md: -------------------------------------------------------------------------------- 1 | # Hoisting and types 2 | 3 | What is the output? 4 | 5 | 6 | ```javascript 7 | var a = 1; 8 | function b() { 9 | a = 10; 10 | return; 11 | function a() { 12 | } 13 | } 14 | b(); 15 | console.log(a); 16 | ``` 17 | 18 | --- 19 | What is the output? 20 | 21 | ```javascript 22 | var a = {}; 23 | var b = { key: 'b' }; 24 | var c = { key: 'c' }; 25 | 26 | a[b] = 123; 27 | a[c] = 456; 28 | console.log(a[b]); 29 | ``` 30 | 31 | --- 32 | What is the output? 33 | 34 | ```javascript 35 | console.log("1" + 2); 36 | console.log(2 + "1"); 37 | console.log(1 + 2 + 3 + 4 + "5"); 38 | ``` 39 | 40 | 41 | What for use next contruction? 42 | 43 | 44 | ```javascript 45 | function greetAll() { 46 | var args = Array.prototype.slice.call(arguments, 0); 47 | } 48 | ``` 49 | 50 | --- 51 | What is the output? 52 | 53 | ```javascript 54 | function test() { 55 | console.log(a); 56 | console.log(foo()); 57 | 58 | var a = 1; 59 | 60 | function foo() { 61 | return 2; 62 | } 63 | } 64 | test(); 65 | ``` 66 | 67 | --- 68 | What is the output? 69 | 70 | ```javascript 71 | (function() { 72 | alert(inner); 73 | inner(); 74 | function inner() { 75 | alert('inner'); 76 | } 77 | })(); 78 | ``` 79 | 80 | 81 | What is the output? 82 | 83 | 84 | ```javascript 85 | (function { 86 | alert(inner); 87 | inner(); 88 | var inner = function() { 89 | alert('inner'); 90 | } 91 | })(); 92 | ``` 93 | 94 | 95 | What is the output? 96 | 97 | 98 | ```javascript 99 | (function() { 100 | f(); 101 | f = function() { 102 | console.log(1); 103 | } 104 | })(); 105 | function f() { 106 | console.log(2) 107 | } 108 | f(); 109 | ``` 110 | 111 | --- 112 | What is the output? 113 | 114 | ```javascript 115 | (function() { 116 | var x = 1; 117 | 118 | function x() {}; 119 | 120 | console.log(x); 121 | })(); 122 | ``` 123 | 124 | --- 125 | `number / undefined / function / Error` ? 126 | 127 | ```javascript 128 | var f = function g(){ return 23; }; 129 | typeof g(); 130 | ``` 131 | 132 | --- 133 | what is x ? 134 | 135 | ```javascript 136 | var y = 1, x = y = typeof x; 137 | x; 138 | ``` 139 | 140 | --- 141 | Output? 142 | 143 | ```javascript 144 | var x = [typeof x, typeof y][1]; 145 | typeof typeof x; 146 | ``` 147 | 148 | --- 149 | Output? Just be attentive 150 | 151 | ```javascript 152 | (function(foo){ 153 | return typeof foo.bar; 154 | })({ foo: { bar: 1 } }); 155 | ``` 156 | 157 | --- 158 | Output 159 | 160 | ```javascript 161 | (function() { 162 | logMe(); 163 | var logMe = function() { 164 | console.log('Jesus, George, it was a wonder I was even born.'); 165 | }; 166 | logMe(); 167 | 168 | function logMe() { 169 | console.log('Great Scott!'); 170 | } 171 | logMe(); 172 | })(); 173 | ``` 174 | 175 | --- 176 | result? 177 | 178 | ```javascript 179 | new String('Hello') === 'Hello' 180 | ``` 181 | 182 | --- 183 | result? 184 | 185 | ```javascript 186 | "This is a string" instanceof String; 187 | ``` 188 | 189 | --- 190 | output ? 191 | 192 | ```javascript 193 | var a = 1; 194 | var b = function() { 195 | a = 10; 196 | return a; 197 | function a() { 198 | a = 5; 199 | } 200 | }; 201 | console.log(b(), a); 202 | ``` 203 | 204 | --- 205 | output? 206 | 207 | ```javascript 208 | var x = [typeof x, typeof y][1]; 209 | typeof typeof x; 210 | ``` 211 | 212 | --- 213 | output? 214 | 215 | ```javascript 216 | (function f(){ 217 | function f(){ return 1; } 218 | return f(); 219 | function f(){ return 2; } 220 | })(); 221 | ``` 222 | 223 | --- 224 | result? 225 | 226 | ```javascript 227 | function f(){ return f; } 228 | new f() instanceof f; 229 | ``` 230 | 231 | --- 232 | output? 233 | 234 | ```javascript 235 | var text = 'outside'; 236 | function logIt(){ 237 | console.log(text); 238 | var text = 'inside'; 239 | }; 240 | logIt(); 241 | ``` 242 | 243 | --- 244 | output? ( nb: answer depends on environment / browser ) 245 | 246 | ```javascript 247 | (function() { 248 | var a = 'initial'; 249 | if(a) { 250 | function f() { console.log("1"); }; 251 | } else { 252 | function f() { console.log("2"); }; 253 | } 254 | f(); 255 | })(); 256 | ``` 257 | 258 | --- 259 | output? 260 | 261 | ```javascript 262 | (function() { 263 | var a = 0; 264 | f(); 265 | if( a ) { 266 | function f() { console.log("1"); }; 267 | } else { 268 | function f() { console.log("2"); }; 269 | } 270 | })(); 271 | ``` 272 | 273 | --- 274 | What does the following code do? And why? ( quirks ) 275 | 276 | ```javascript 277 | falseStr = "false"; 278 | if(true){ 279 | var falseStr; 280 | if(falseStr){ 281 | console.log("false" == true); 282 | console.log("false" == false); 283 | } 284 | } 285 | ``` 286 | 287 | --- 288 | how to check if something is object? 289 | NB: asker should keep in mind: 290 | - typeof null => 'object' 291 | - `Object.create(null) instanseof Object => false` 292 | - `typeof function() {} => 'function'` , but it's still object 293 | 294 | --- 295 | output? 296 | 297 | ```javascript 298 | var a = (1,2,3); 299 | console.log(a); 300 | ``` 301 | 302 | --- 303 | What will be the output? 304 | 305 | ```javascript 306 | (function() { 307 | var a = b = 5; 308 | })(); 309 | console.log(b); 310 | ``` 311 | 312 | --- 313 | output? 314 | 315 | ```javascript 316 | var text = 'outside'; 317 | function logIt(){ 318 | console.log(text); 319 | var text = 'inside'; 320 | }; 321 | logIt(); 322 | ``` 323 | 324 | --- 325 | is it possible to have 326 | 327 | ```javascript 328 | (a == 1 && a == 2 && a == 3); // true 329 | ``` 330 | 331 | 332 | by https://twitter.com/hugojmd/status/953763304958255105 333 | 334 | 335 | ```javascript 336 | var a = { 337 | currentValue: 0, 338 | valueOf() { 339 | return this.currentValue += 1 340 | } 341 | } 342 | var eq = (a == 1 && a == 2 && a == 3); 343 | console.log(eq); // awesome =) 344 | ``` 345 | 346 | 347 | --- 348 | 349 | what whould be the output? 350 | 351 | 352 | ```javascript 353 | foo(); 354 | 355 | var foo = function() { 356 | console.log(false); 357 | } 358 | 359 | foo(); 360 | 361 | function foo() { 362 | console.log(true); 363 | } 364 | 365 | foo(); 366 | ``` 367 | 368 | -------------------------------------------------------------------------------- /topics/inheritance-vs-context.md: -------------------------------------------------------------------------------- 1 | # Inheritance and context 2 | 3 | What is the output? Fix code 4 | 5 | 6 | ```javascript 7 | var person = { 8 | name: "Sam", 9 | hello: function() { 10 | alert(this.name); 11 | } 12 | }; 13 | var hello = person.hello; 14 | hello(); // Make it to output "Sam" 15 | ``` 16 | 17 | --- 18 | What is the output? 19 | 20 | ```javascript 21 | var fn = {}; 22 | function valueAccessor(value) { 23 | var accessor = function(newValue) { 24 | if(arguments.length === 0) { 25 | return value; 26 | } 27 | value = newValue; 28 | }; 29 | accessor.__proto__ = fn; 30 | return accessor; 31 | } 32 | var a = valueAccessor(5); 33 | fn.incrementValue = function() { this(this() + 1); }; 34 | a.incrementValue(); 35 | a(); 36 | ``` 37 | 38 | --- 39 | Update code for conditions 40 | 41 | ```javascript 42 | function A() { 43 | this.value = 1; 44 | } 45 | var B = function() {} ; 46 | /* put your code here */ 47 | var b = new B; 48 | b.value === undefined; // should be true 49 | b instanceof A; // should be true 50 | ``` 51 | 52 | --- 53 | Explain the difference 54 | 55 | ```javascript 56 | function User(name) { 57 | this.name = name; 58 | this.hello = function() { 59 | alert(this.name); 60 | } 61 | } 62 | // -- vs -- ( what is the difference ?) 63 | function User(name) { 64 | this.name = name; 65 | } 66 | User.prototype.hello = function() { 67 | alert(this.name); 68 | }; 69 | ``` 70 | 71 | --- 72 | What is the output? Fix code 73 | 74 | ```javascript 75 | Logger = function(logFn) { 76 | _logFn = logFn; 77 | this.log = function(message) { 78 | _logFn(new Date() + ": " + message); 79 | } 80 | }; 81 | var logger = new Logger(console.log); 82 | logger.log("Hi!"); 83 | logger.log("Wazzup?"); 84 | ``` 85 | 86 | 87 | Explain difference between `.call/.apply/.bind` 88 | 89 | --- 90 | 91 | Create `.bind` polyfill 92 | 93 | --- 94 | 95 | Create `.newInstance` method which has behaviour like `.apply` for constructors 96 | 97 | Examples: `new A(1,2,3)` should be equal to `A.newInstance([1,2,3])` 98 | 99 | --- 100 | 101 | Describe what happens in next line ( and difference ) 102 | 103 | 104 | ```javascript 105 | function User(name) { this.name = name; } 106 | var u1 = User('Bob'); 107 | var u2 = new User('Sam'); 108 | var u3 = User.call({}, 'Mike'); // <-- N.B. 109 | ``` 110 | 111 | --- 112 | Create singleton 113 | 114 | ```javascript 115 | var getInstance = /* put your code here */; 116 | var o1 = getInstance(); 117 | var o2 = getInstance(); 118 | o1 instanceof User; // true 119 | o1 === o2; // true 120 | ``` 121 | 122 | 123 | modify example above 124 | 125 | 126 | ```javascript 127 | var User = /* your code */ 128 | var u1 = new User(1); 129 | var u2 = new User(2); 130 | u1 === u2; // true 131 | ``` 132 | 133 | --- 134 | What does it do and how it works? 135 | 136 | ```javascript 137 | function bind(method, context) { 138 | var args = Array.prototype.slice.call(arguments, 2); 139 | return function() { 140 | var a = args.concat(Array.prototype.slice.call(arguments, 0)); 141 | return method.apply(context, a); 142 | } 143 | } 144 | ``` 145 | 146 | 147 | How many ways do you know to check if something is Array (`.isArray` / `instanceof` / `Object.prototype.toString.call([])` etc.) 148 | 149 | --- 150 | 151 | Output? 152 | 153 | 154 | ```javascript 155 | var foo = { 156 | bar: function() { return this.baz; }, 157 | baz: 1 158 | }; 159 | (function(){ 160 | return typeof arguments[0](); 161 | })(foo.bar); 162 | ``` 163 | 164 | --- 165 | Output ? 166 | 167 | ```javascript 168 | var foo = { 169 | bar: function(){ return this.baz; }, 170 | baz: 1 171 | } 172 | typeof (f = foo.bar)(); 173 | ``` 174 | 175 | --- 176 | With ( oldschool) `1 / 2 / undefined / Error` ? 177 | 178 | ```javascript 179 | with (function(x, undefined){}) length; 180 | ``` 181 | 182 | --- 183 | Implement `Object.create` - like inheritance 184 | * You can't use `Object.create` / `__proto__`* 185 | * 186 | 187 | ```javascript 188 | var A = function() { }; 189 | var B = function() { }; 190 | var b = new B(); // A wasn't called 191 | b instanceof A // true 192 | B.prototype.addSome = 1; 193 | A.prototype.addSome; // undefined 194 | ``` 195 | 196 | --- 197 | result? 198 | 199 | ```javascript 200 | var x = 10; 201 | var foo = { 202 | x: 20, 203 | bar: function () { 204 | var x = 30; 205 | return this.x; 206 | } 207 | }; 208 | console.log( 209 | foo.bar(), 210 | (foo.bar)(), 211 | (foo.bar = foo.bar)(), 212 | (foo.bar, foo.bar)() 213 | ); 214 | ``` 215 | 216 | --- 217 | output ? 218 | 219 | ```javascript 220 | function f(x, y) { 221 | x = 10; 222 | console.log( 223 | arguments[0], 224 | arguments[1] 225 | ); 226 | } 227 | f(); 228 | ``` 229 | 230 | --- 231 | Create “native” methods 232 | Define a repeatify function on the String object. The function accepts an integer that specifies how many times the string has to be repeated. The function returns the string repeated the number of times specified. For example: 233 | 234 | ```javascript 235 | console.log('hello'.repeatify(3)); // hellohellohello 236 | ``` 237 | 238 | --- 239 | difference in next methods? 240 | 241 | ```javascript 242 | (a instanceof Array) 243 | // vs 244 | (Array.isArray(a)); 245 | ``` 246 | 247 | 248 | http://stackoverflow.com/questions/22289727/difference-between-using-array-isarray-and-instanceof-array 249 | 250 | --- 251 | 252 | Implement function, which can't be used as constructor ( with `new` keyword ) 253 | 254 | --- 255 | 256 | Implement `applyConstructor(ClassFunction, arrayWithArguments)` function, which allows to do the same as 257 | `new ClassFunction(...arrayWithArguments)` 258 | 259 | Babel says that 260 | 261 | 262 | ```javascript 263 | new (Function.prototype.bind.apply(ClassFunction, arrayWithArguments))(); 264 | ``` 265 | 266 | 267 | one of the variants 268 | 269 | Any other variants? tricky question to discuss subtle highlights about inheritance 270 | -------------------------------------------------------------------------------- /topics/passing-by-value-and-by-reference.md: -------------------------------------------------------------------------------- 1 | # Passing by value and by reference 2 | 3 | What is the output? 4 | 5 | 6 | ```javascript 7 | var myObject = { 8 | price: 20.99, 9 | get_price: function() { 10 | return this.price; 11 | } 12 | }; 13 | var customObject = Object.create(myObject); 14 | customObject.price = 19.99; 15 | delete customObject.price; 16 | console.log(customObject.get_price()); 17 | ``` 18 | 19 | --- 20 | What is the output? 21 | 22 | ```javascript 23 | (function(a) { 24 | arguments[0] = 10; 25 | return a; 26 | })(5); 27 | ``` 28 | 29 | --- 30 | What is the output? 31 | 32 | ```javascript 33 | function Car(color) { 34 | this.color = color; 35 | } 36 | var lada = new Car("Black"); 37 | Car.prototype.currentGear = 1; 38 | console.log(++lada.currentGear); 39 | console.log(Car.prototype.currentGear); 40 | ``` 41 | 42 | --- 43 | What is the output? 44 | 45 | ```javascript 46 | var User = function() {}; 47 | 48 | User.prototype.attributes = { 49 | isAdmin: false 50 | }; 51 | 52 | var admin = new User("Sam"), 53 | guest = new User("Bob"); 54 | 55 | admin.attributes.isAdmin = true; 56 | 57 | alert(admin.attributes.isAdmin); 58 | alert(guest.attributes.isAdmin); 59 | ``` 60 | 61 | --- 62 | 63 | What is the output? 64 | 65 | ```javascript 66 | var obj = { 67 | a: 1 68 | }; 69 | (function(obj) { 70 | obj = { 71 | a: 2 72 | }; 73 | })(obj); 74 | console.log(obj.a); 75 | ``` 76 | 77 | --- 78 | What is the value of foo.x? 79 | 80 | ```javascript 81 | var foo = { n: 1 }; 82 | var bar = foo; 83 | foo.x = foo = { n: 2 }; 84 | ``` 85 | 86 | --- 87 | how to return result for async operation in sync style? 88 | like `.getData()` - should return data synchroniously, but data get in async by ajax. let's discuss workarounds 89 | 90 | --- 91 | About prototype inheritance / passing by reference - What is the output? 92 | 93 | ```javascript 94 | function Person(name) { 95 | if (name) this.options.name = name; 96 | } 97 | 98 | Person.prototype.options = { 99 | name: "Default name" 100 | }; 101 | 102 | var foo = new Person("foo"); 103 | var bar = new Person("bar"); 104 | 105 | console.log(foo.options.name); 106 | console.log(bar.options.name); 107 | ``` 108 | 109 | 110 | --- 111 | 112 | what would be the output ? 113 | 114 | 115 | ```javascript 116 | var a = {}; 117 | 118 | (function b ( a ) { 119 | a.a = 10; 120 | a = null; 121 | })( a ); 122 | 123 | console.log(a); 124 | ``` 125 | 126 | -------------------------------------------------------------------------------- /topics/quirks.md: -------------------------------------------------------------------------------- 1 | # Quirks 2 | 3 | What will be the output? 4 | 5 | 6 | ```javascript 7 | function foo(x) { 8 | console.log(arguments) 9 | return x 10 | } 11 | foo(1, 2, 3, 4, 5) 12 | ``` 13 | 14 | 15 | and 16 | 17 | 18 | ```javascript 19 | function foo(x) { 20 | console.log(arguments) 21 | return x 22 | }(1, 2, 3, 4, 5) 23 | ``` 24 | 25 | --- 26 | What will be the output 27 | 28 | ```javascript 29 | a = [1,2,3,4] 30 | a[1.5] = 1.5 31 | a // ? 32 | ``` 33 | 34 | --- 35 | What will be the output 36 | 37 | ```javascript 38 | function foo(){console.log("hello")} 39 | foo.call.call.call.apply(function bar(x) {console.log(x)}, [this,"world"]) 40 | ``` 41 | 42 | 43 | What will be the output 44 | 45 | 46 | ```javascript 47 | console.log("1" + 2); 48 | console.log(2 + "1"); 49 | console.log(1 + 2 + 3 + 4 + "5"); //<-- nb 50 | ``` 51 | 52 | --- 53 | Make it true 54 | 55 | ```javascript 56 | var a; 57 | /* put your code here */ 58 | a !== a; // should be true 59 | ``` 60 | 61 | 62 | What will be the output 63 | 64 | 65 | ```javascript 66 | var scores = [98, 74,85, 77, 93,100,89]; 67 | var total = 0; 68 | for (var score in scores) { 69 | total += score; 70 | } 71 | var mean = total / scores.length; 72 | console.log(mean); //? 73 | ``` 74 | 75 | --- 76 | What will be the output 77 | 78 | ```javascript 79 | [2, 3, -1, -6, 0, -108, 42, 10].sort(); 80 | ``` 81 | 82 | 83 | What is the difference between 0 / -0 ? 84 | 85 | --- 86 | 87 | What will be the output 88 | 89 | 90 | ```javascript 91 | var y = 1; 92 | if (function f(){}) { 93 | y += typeof f; 94 | } 95 | console.log(y); 96 | ``` 97 | 98 | --- 99 | What will be the output 100 | 101 | ```javascript 102 | var foo = function bar(){ return 12; }; 103 | typeof bar(); 104 | ``` 105 | 106 | --- 107 | What will be the output 108 | 109 | ```javascript 110 | var a={}, 111 | b={key:'b'}, 112 | c={key:'c'}; 113 | 114 | a[b]=123; 115 | a[c]=456; 116 | console.log(a[b]); 117 | ``` 118 | 119 | --- 120 | What will be the output? 121 | 122 | ```javascript 123 | ['11','11','11','11'].map(parseInt) 124 | ``` 125 | 126 | --- 127 | what will display alert? 128 | 129 | ```javascript 130 | function aaa() { 131 | return 132 | { 133 | test: 1 134 | }; 135 | } 136 | alert(typeof aaa()); 137 | ``` 138 | 139 | 140 | What is alerted? 141 | 142 | 143 | ```javascript 144 | function bar() { 145 | return foo; 146 | foo = 10; 147 | function foo() {} 148 | var foo = '11'; 149 | } 150 | alert(typeof bar()); 151 | ``` 152 | 153 | --- 154 | Output? 155 | 156 | ```javascript 157 | console.log("1" - - "1") 158 | ``` 159 | 160 | --- 161 | what is the output? 162 | 163 | ```javascript 164 | var x = 3; 165 | var foo = { 166 | x: 2, 167 | baz: { 168 | x: 1, 169 | bar: function() { 170 | return this.x; 171 | } 172 | } 173 | } 174 | var go = foo.baz.bar; 175 | alert(go()); 176 | alert(foo.baz.bar()); 177 | ``` 178 | 179 | --- 180 | output? 181 | 182 | ```javascript 183 | var myArr = ['foo', 'bar', 'baz']; 184 | myArr.length = 0; 185 | myArr.push('bin'); 186 | console.log(myArr); 187 | ``` 188 | 189 | --- 190 | Output? 191 | 192 | ```javascript 193 | var x = 0; 194 | function foo() { 195 | x++; 196 | this.x = x; 197 | return foo; 198 | } 199 | var bar = new new foo; 200 | console.log(bar.x); 201 | ``` 202 | 203 | --- 204 | result? 205 | 206 | ```javascript 207 | var bar = 1, 208 | foo = {}; 209 | foo: { 210 | bar: 2; 211 | baz: ++bar; 212 | }; 213 | foo.baz + foo.bar + bar; 214 | ``` 215 | 216 | --- 217 | output? 218 | 219 | ```javascript 220 | var myArr = ['foo', 'bar', 'baz']; 221 | myArr[2]; 222 | console.log('2' in myArr); 223 | ``` 224 | 225 | 226 | output? 227 | 228 | 229 | ```javascript 230 | function foo(a, b) { 231 | arguments[1] = 2; 232 | alert(b); 233 | } 234 | foo(1); 235 | ``` 236 | 237 | --- 238 | What value is alerted? 239 | 240 | ```javascript 241 | function foo(){} 242 | delete foo.length; 243 | alert(typeof foo.length); 244 | ``` 245 | 246 | --- 247 | output ? 248 | 249 | ```javascript 250 | var f = function g(){ return 23; }; 251 | typeof g(); 252 | ``` 253 | 254 | --- 255 | output? 256 | 257 | ```javascript 258 | var f = (function f(){ return "1"; }, function g(){ return 2; })(); 259 | typeof f; 260 | ``` 261 | 262 | --- 263 | output ? 264 | 265 | ```javascript 266 | var a = 1, 267 | b = function a(x) { 268 | x && a(--x); 269 | }; 270 | alert(a); 271 | ``` 272 | 273 | --- 274 | output? 275 | 276 | ```javascript 277 | function a() { 278 | alert(this); 279 | } 280 | a.call(null); 281 | ``` 282 | 283 | --- 284 | result? 285 | 286 | ```javascript 287 | var foo = bar ? bar : 0; 288 | ``` 289 | 290 | --- 291 | How to empty an array in JavaScript ? 292 | 293 | ```javascript 294 | var arrayList = ['a','b','c','d','e','f']; 295 | // how many ways? compare them 296 | ``` 297 | 298 | --- 299 | result? =) 300 | 301 | ```javascript 302 | var a = (1,5 - 1) * 2 303 | ``` 304 | 305 | --- 306 | output? 307 | 308 | ```javascript 309 | // http://stackoverflow.com/questions/39277394/why-settimeout-calls-make-different-result 310 | setTimeout(function() { 311 | setTimeout(function() { 312 | console.log('foo'); 313 | }, 50); 314 | }, 100); 315 | setTimeout(function() { 316 | setTimeout(function() { 317 | console.log('baz'); 318 | }, 100); 319 | }, 50); 320 | ``` 321 | 322 | --- 323 | result? 324 | 325 | ```javascript 326 | 5 > 3 > 2 327 | ``` 328 | 329 | --- 330 | what is logged in the console? 331 | 332 | ```javascript 333 | var a; 334 | if (a = (1+1==2)) { 335 | console.log(a); 336 | } else { 337 | console.log('false'); 338 | } 339 | ``` 340 | 341 | --- 342 | are next expressions equal ? what's the result for both? 343 | 344 | ```javascript 345 | 1 << 33 346 | (1 << 31) << 2 347 | ``` 348 | 349 | 350 | --- 351 | 352 | What will be the output 353 | 354 | 355 | ```javascript 356 | let y = 1; 357 | if (function F(){}) { 358 | y += typeof F; 359 | } 360 | console.log(y); 361 | ``` 362 | 363 | -------------------------------------------------------------------------------- /topics/wft.md: -------------------------------------------------------------------------------- 1 | # WTF 2 | 3 | The file about strange questions. But it still be usefull to discover logic 4 | 5 | --- 6 | 7 | ### From ["Хитрые задачки на собеседовании JavaScript"](https://habrahabr.ru/post/322568/) 8 | 9 | what is g value? 10 | 11 | 12 | ```javascript 13 | f = g = 0; 14 | (function () { 15 | try { 16 | f = function() { 17 | return f(); 18 | }; 19 | f(); 20 | } catch (e) { 21 | return g++ && f(); 22 | } finally { 23 | return ++g; 24 | } 25 | function f() { g += 5; return 0; } 26 | }) (); 27 | ``` 28 | 29 | 30 | --- 31 | 32 | what is g value? 33 | 34 | 35 | ```javascript 36 | f = g = 0; 37 | (function () { 38 | try { 39 | f = function() { 40 | return f(); 41 | } && f(); 42 | } catch (e) { 43 | return g++ && f(); 44 | } finally { 45 | return ++g; 46 | } 47 | function f() { g += 5; return 0; } 48 | }) (); 49 | ``` 50 | 51 | 52 | --- 53 | 54 | what will be the output? 55 | 56 | 57 | ```javascript 58 | function b(b) { 59 | return this.b && b(b) 60 | } 61 | b(b.bind(b)) 62 | ``` 63 | 64 | 65 | --- 66 | 67 | what will be the output? 68 | 69 | 70 | ```javascript 71 | c = (c) => { 72 | return this.c && c(c) 73 | } 74 | c(c.bind(c)) 75 | ``` 76 | 77 | 78 | --- 79 | 80 | output? ( just remember about prefix / postfix increment ) 81 | 82 | 83 | ```javascript 84 | var g = 0; 85 | g = 1 && g++; 86 | console.log(g); 87 | ``` 88 | 89 | 90 | which one is correct ? ( about IIFE trick ) 91 | 92 | 93 | ```javascript 94 | !function(){}() 95 | function(){}() 96 | true && function(){}() 97 | (function(){})() 98 | function(){} 99 | !function(){} 100 | ``` 101 | 102 | 103 | --- 104 | 105 | what will expression return? 106 | 107 | 108 | ```javascript 109 | var a = b = true, c = (a) => a; 110 | (function a(a = c(b).a = c = () => a) { return a(); })() 111 | ``` 112 | 113 | 114 | --- 115 | 116 | result? 117 | 118 | 119 | ```javascript 120 | var a = true; 121 | (a = function () { return a })() 122 | ``` 123 | 124 | 125 | --- 126 | 127 | what will be the output? 128 | 129 | 130 | ```javascript 131 | var v = 0; 132 | try { 133 | throw v = (function(c) { throw v = function(a){ return v; } })(); 134 | } catch (e) { 135 | console.log (e()()); 136 | } 137 | ``` 138 | 139 | --------------------------------------------------------------------------------