346、What will be value of y?【运算符优先级】
var y, x = 1; y = x++ + x;
347、You have variable that may or may not be a number. Write function isNumber() that will return true if it is in fact number or false otherwise.【类型转换】
348、Explain what will be output of each of following expressions:
5 - "4" 5 + "4" 5 + null !{}[true] +[1] +[1, 2] 7 - "a" 7 / 0
349、What output you will see in the console?【引用】
var obj = { foo: [] }; var boo = obj.foo; boo.push("Hi there!"); obj.foo = obj.foo.concat(boo); console.log(obj);
350、Describe what is the following construction, when and why you will use it【IIFE】
(function() {})()
351、Write code, that will provide following behaviour:【currying】
add(3)(4) == 7;
352、What you will see in the console after executiong the following code?【hositing】
var foo = 10; console.log(foo); foo(); function foo() { console.log("foo"); }
353、What is JSONP? How and when you will use it?
【JavaScript Interview Questions!】有代码
354、What is a closure?
355、What is the difference between apply, call, and bind?
356、What is event delegation?
357、What is event bubbling?
358、What is hoisting and how does it work?
359、What does this console?
360、What is the prototype chain?
361、What does this console?
362、Rapid-fire questions!
363、What determines the value of ‘this’?
364、What is the event loop?
365、What is the output?
366、Implement curry.
【What Do I Need to Know to Ace a JavaScript Interview?】相关概念以及参考文献
367、Functional programming
368、What is the event loop? The asynchronous nature of JavaScript
369、Javascript. The core. Scope chain, prototype chain, scope, closure, constructor, and this.
370、Design patterns and inheritance
371、REST API design
372、DOM: HTML / CSS / Twitter Bootstrap / jQuery
373、Search Engine Optimization
374、Regular expressions
375、Testing
【Most Common Technical Interview Question for FrontEnd Developers】
376、How can you declare a class in Javascript?
377、How would you organize your Javascript code?
378、Have you already used MVC before? What you like/dislike about it?
379、How can you add a method to a class already defined?
【Web Developer Interview Questions And Answers】
380、What is CORS? How does it work?
381、Name some Javascript functions used to convert non numerical values into numbers.【类型转换数字】
【Top 20 Interview questions for front end Developers】
382、What are the falsy values in JS?
383、What is output for below code? What is JS hoist?
var num = 5; function xyz() { alert(num); //result of num? Undefined var num = 10; alert(num); //result of num? 10 } xyz();
384、How to pass function as parameter in another function, Give any example?【高阶函数】
385、What is bind in JS, Explain about function bind?
386、How to attach an event dynamically to DIV tag in my HTML doc?【委托】
387、Explain below JS code, what is difference between below two scenarios?
var x = function() { console.log("Hi"); }; x(); function x() { console.log("helo"); } x();
388、dvantages and Disadvantages with anonymous function in JS?
389、Various types of object declaration?【对象声明】
390、Solve the below problem?【数组操作】
【Front-end developer interview questions】
391、Asynchronous vs synchronous
392、IIFE
393、CORS
【15 JavaScript interview questions and answers】
394、What are the advantages of using JavaScript?
395、What are the disadvantages of using JavaScript?
396、Explain the difference between classical inheritance and prototypal inheritance.【对象】
397、Give an example of a time that you used functional programming in JavaScript.【函数式编程】
398、Give an example of a time that you used Prototypal OO in JavaScript.
399、What is a RESTful Web Service?
400、How experienced are you with MEAN?(MongoDB, Express, AngularJS, and Node.js)
401、Explain the differences between one-way data flow and two-way data binding.【单向与双向数据流】
402、Determine the output of the code below. Explain your answer.【浮点数】
console.log(0.1 + 0.2); console.log(0.4 + 0.1 == 0.5);
403、Determine the output of the code below. Explain your answer.【作用域】
【50 Front End Developer Interview Questions】
404、When do you use bracket notation versus dot notation for objects?【对象】
405、How do you change an element attribute with JavaScript?【脚本化属性】
406、How do you update your local version of a Github repo with the latest changes to the remote repo?【Git】
407、What happens when you pass a function too few or too many arguments in JavaScript?【传参】
408、Why do you want to avoid polluting the global name space?
409、How would you retrieve a specific value from an array of objects?【检索值】
410、What is the difference between JSON and a javascript object?
411、How do you change the class attribute of an element with JS?【脚本化CSS类】
【Commonly asked Interview Questions for Front End Developers】
412、What is the difference between this and e in the callback in the above code? In general, event could be anything, not just the load event. Interviewee is expected to know the syntax for sending AJAX request using bare JS.
var request = new XMLHttpRequest(); request.addEventListener("load", function(e) { console.log(this.responseText); var obj; try { obj = JSON.parse(this.responseText); } catch (ex) {} }); request.open( "GET", "http://api.openweathermap.org/data/2.5/weather?q=delhi&APPID=0d84d993b430de4bebaa89bf7513676e" ); request.send();
413、Different ways to create objects in JS? Explain Object.defineProperty().【对象】
414、Scope and execution context in JS?
415、How does JS manage multiple events in parallel, like click, input, etc. when it is interpreted & single threaded?
【Frontend Interview Questions and Answers for experienced】
416、Singleton through a function【设计模式】
【Front End Web Developer interview questions】
417、Describe event propagation (bubbling phase) in your own words. Is there any other phase in the DOM Event flow that you know of?
418、Which steps constitute the Critical Rendering Path for web browsers?哪些步骤构成Web浏览器的关键呈现路径?
419、Are objects in Javascript passed by reference or by value?Javascript中的对象是否通过引用或值传递?
420、Explain why the following doesn’t work as an IIFE:
function foo(){ }();
421、What is this event loop all about? A mouse click would result in a new item being added to the call stack or the task queue?【事件循环】
422、What is alert going to show?【hositing】
var foo = 1; function bar() { if (!foo) { var foo = 10; } alert(foo); } bar();
【Preparing for a Front-End Web Development Interview in 2017】
423、Execution context, especially lexical scope and closures.
424、Hoisting, function & block scoping and function expressions & declarations.
425、Binding – specifically call, bind, apply and lexical this.
426、Object prototypes, constructors and mixins.
427、Composition and high order functions.【高阶函数】
428、Type Coercion using typeof, instanceof and Object.prototype.toString.
429、Handling asynchronous calls with callbacks, promises, await and async.
430、When to use function declarations and expressions.何时使用函数声明和表达式。
431、Traversal up and down – Node.parentNode, Node.firstChild, Node.lastChild and Node.childNodes.【遍历】
432、Traversal left and right – Node.previousSibling and Node.nextSibling.
433、Manipulation – add, remove, copy, and create nodes in the DOM tree. You should know operations such as how to change the text content of a node and toggle, remove or add a CSS classname.【DOM】
434、Performance – touching the DOM can be expensive when you have many nodes, you should at least know about document fragments and node caching.【高性能JavaScript】
四、算法
【JS: Interview Questions part -4: Stack, Queue, Linked List】
1、How will you implement stack and queue with JavaScript?【Stack and Queue】
2、you have to use a maximizing heap to manage a priority queue. Hence while extracting, you just get the one on the top and
3、while inserting you will do it at the bottom【Priority Queue】
4、How will you create a linked list in JavaScript?【Singly Linked List】单链表
5、for doubly linked list there will be a link backward to the previous element.【Doubly Linked List】双链表
6、How could you write an extension to remove a node from a LL【Remove Node from Singly LL】
7、How would you reverse a singly LL (no loop)?【Reverse Singly Linked List】
8、reverse the doubly linked list without using extra space【Reverse Doubly LL】
9、How could you get the Kth node from the end (no loop)【kth node from End】
10、How could you delete kth node from the end of a singly LL (no loop)【Delete kth node from the end】
11、How could you delete a node from a doubly linked list?
12、How would you merge two unsorted linked list?【merge two unsorted array】
13、How could you find intersect of two SLL in single iteration?【Intersect of two LL】
14、How would you sort a linked list?【sort Linked list】
15、Given an integer linked list of which both first half and second half are sorted independently. Write a function to merge the
16、two parts to create one single sorted linked list in place [do not use any extra space].【special sort】
17、Delete the repeated elements in a unsorted singly linked list in O(n) time complexity without using extra space.【Remove
18、duplicate from unsorted LL】
19、How would you verify a prime number?【check Prime】素数
20、How could you find all prime factors of a number?【Prime Factors】
21、How do get nth Fibonacci number?【Fibonacci】
22、How would you find the greatest common divisor of two numbers?【Greatest Common Divisor】最大公约数
23、How would you remove duplicate members from an array?【remove Duplicate】
24、How would you merge two sorted array?【merge two sorted array】
25、How would you swap two numbers without using a temporary variable?【swap number without temp】
26、How would you reverse a string in JavaScript?【string reverse】6个小问题
27、How would you reverse words in a sentence?【reverse words】
28、If you have a string like "I am the good boy". How can you generate "I ma eht doog yob"? Please note that the words are in
29、place but reverse.【reverse in place】
30、How could you find the first non repeating char in a string?【First non repeating char】
31、How will you remove duplicate characters from a sting?【remove duplicate char】
32、How will you verify a word as palindrome?【check palindrome】回文
33、If you have a function that generate random number between 1 to 5 how could u generate random number 1 to 7 by using that function?【random between 5 to 7】
34、from a unsorted array of numbers 1 to 100 excluding one number, how will you find that number.【missing number】搜索数字
35、From a unsorted array, check whether there are any two numbers that will sum up to a given number?【Sum of two】指定两个数字的和搜索
36、How would you find the largest sum of any two elements?【Largest Sum】最大和
37、Count Total number of zeros from 1 upto n?【Counting Zeros】带0值的数量
38、How can you match substring of a sting?【subString】
39、How would you create all permutation of a string?【Permutations】排列
40、topK
41、翻转单链表
42、反转二叉树
43、单向列表判断是否有环
44、LeetCode
45、careercup
【Front-End Dev Interview Questions】
46、Write out a function that computes a Factorial given a non-negative integer number.非负整数的因子函数
Write out the function a different way.
In big O notation compare and explain the complexity of both functions.
47、Fizz-Buzz: Write a function that iterates through the numbers 1 - 100 and if the number is divisible by 3 print "fizz", if its divisible by 5 print "buzz", if its divisible by both then print "fizz"
【Interview Algorithm Questions in Javascript:Array】
48、Given an array of integers, find the largest product yielded from three of the integers给定一个整数数组,找到从三个整数产生的最大的乘积
49、Being told that an unsorted array contains (n - 1) of n consecutive numbers (where the bounds are defined), find the missing number in O(n) time一个未排序的数组包含(n - 1)个n个连续数字(定义了界限),在O(n)时间内找到丢失的数字
50、Removing duplicates of an array and returning an array of only unique elements
51、Given an array of integers, find the largest difference between two elements such that the element of lesser value must come before the greater element给定一个整数数组,找到两个元素之间的最大差异,使得较小值的元素必须在更大的元素之前
52、Given an array of integers, return an output array such that output[i] is equal to the product of all the elements in the array other than itself. (Solve this in O(n) without division)给定整数数组,返回一个输出数组,使得输出[i]等于数组中除了本身以外的所有元素的乘积。 (在O(n)中求解)
53、Find the intersection of two arrays. An intersection would be the common elements that exists within both arrays. In this case, these elements should be unique!找到两个数组的交集。 交叉点将是两个数组中存在的常见元素。 在这种情况下,这些元素应该是唯一的!
【Interview Algorithm Questions in Javascript:String】
54、Given a string, reverse each word in the sentence "Welcome to this Javascript Guide!" should be become "emocleW ot siht tpircsavaJ !ediuG"
55、Given two strings, return true if they are anagrams of one another "Mary" is an anagram of "Army"【变位词】改变顺序组成新单词,排序后合并相等
56、Check if a given string is a palindrome "racecar" is a palindrome. "race car" should also be considered a palindrome. Case
57、sensitivity should be taken into account【回文】正序反序相同
58、Check if a given string is a isomorphic【同构】相同位置的字符存在一一对应关系可以相互替换。
【Interview Algorithm Questions in Javascript:Stacks and Queues】
59、Implement enqueue and dequeue using only two stacks仅使用两个堆栈实现入队和出队
60、Create a function that will evaluate if a given expression has balanced parentheses -- Using stacks In this example, we will only consider "{}" as valid parentheses {}{} would be considered balancing. {{{}} is not balanced 创建一个函数,用于评估给定表达式是否具有平衡括号
【Interview Algorithm Questions in Javascript:Recursion】
61、Write a recursive function that returns the binary string of a given decimal number Given 4 as the decimal input, the function should return 100【十进制转为二进制】
62、Write a recursive function that performs a binary search编写执行二进制搜索的递归函数
【Interview Algorithm Questions in Javascript:Numbers】
63、Given an integer, determine if it is a power of 2. If so, return that number, else return -1. (0 is not a power of two)【2的幂】
【Commonly asked Interview Questions for Front End Developers】
64、Optimal strategy for winning a game where let’s say, I start with 1, opponent can cite a number X within the range [2, 11]. Then I have to say a number in the range [X + 1, X + 10], then opponent, then me, and so on. Whoever says 100 in the end wins and the game ends.
五、网络
【Front-end-Developer-Interview-Questions】
1、为什么传统上利用多个域名来提供网站资源会更有效?
2、请尽可能完整得描述从输入 URL 到整个网页加载完毕及显示在屏幕上的整个流程。
3、Long-Polling、Websockets 和 Server-Sent Event 之间有什么区别?
4、请描述以下 request 和 response headers:
Diff. between Expires, Date, Age and If-Modified-...
Do Not Track
Cache-Control
Transfer-Encoding
ETag
X-Frame-Options
5、什么是 HTTP method?请罗列出你所知道的所有 HTTP method,并给出解释。
【Front-End-Developer-Interview-Questions(持续更新)】
6、常见的HTTP method
7、从浏览器地址栏输入url到显示页面的步骤(以HTTP为例)
8、HTTP Request和HTTP Response报文结构是怎样的?
9、HTTP 状态码及其含义
10、TCP 三次握手
11、具体过程
12、为什么要这么设计
13、说一下网络五层模型(HTTP 协议从应用层到底层都基于哪些协议),HTTP 协议头字段说上来几个,缓存字段是怎么定义的,http 和 https 的区别,在具体使用的时候有什么不一样。是否尽可能详细的掌握 HTTP 协议
14、HTTP 状态码
15、1、2、3、4、5 开头分别表示什么
16、301 和 302 的区别、为什么要区分
17、304 表示什么
18、如何防止 304
19、keep-alive
20、cookies 是干嘛的,服务器和浏览器之间的 cookies 是怎么传的,httponly 的 cookies 和可读写的 cookie 有什么区别,有无长度限制,cookies 被禁用后可以考虑用什么替代
21、GET/POST 区别
22、一个页面从输入 URL 到页面加载完的过程中都发生了什么事情?越详细越好
23、关于 HTTP2 知道哪些?对未来前端开发可能会有哪些影响?
24、什么是Etag?
25、Expires和Cache-Control
26、关于Http 2.0 你知道多少?
【http-api-design】 【HTTP API 设计指南翻译版】
27、既然 HTTPS 解决了我们关注的隐私、安全问题,那么为什么这么少的网站使用呢?
28、HTTPS,百度运维团队的总结
【Rest】Wiki
【Most Common Technical Interview Question for FrontEnd Developers】
29、When would you use GET and POST requests?
【Web Developer Interview Questions And Answers】
30、Describe the key advantages of HTTP/2 as compared with HTTP 1.1.
【Commonly asked Interview Questions for Front End Developers】
31、Sequence of steps that happen when a URL is entered in the address bar of the browser?
六、项目和职业规划
1、对前端模块化的认识【AMD CMD】
2、用过哪些设计模式?
3、说说你对AMD和Commonjs的理解
4、说说你对MVC和MVVM的理解
【Interview questions for a frontend developer】
5、Have you ever used an MVC? Which one and what do you like and dislike about it?
【Preparing for a Front-End Web Development Interview in 2017】
6、Separation of concerns – Model-View-Controller (MVC), Model-View-ViewModel (MVVM) and Model-View-Presenter (MVP) patterns.
七、性能
【Front-end-Developer-Interview-Questions】
1、你会用什么工具来查找代码中的性能问题?
2、你会用什么方式来增强网站的页面滚动效能?
3、请解释 layout、painting 和 compositing 的区别。
4、雅虎 24 条,说出越多越好
5、是否有其他性能优化的经验?
6、页面性能一般可以有哪些指标
7、页面性能记录和分析有哪些方法?除了常见的那些方法之外在现代浏览器里还有其他什么新手段吗?
8、用过什么性能分析的工具
9、移动端性能优化
【Front-End Dev Interview Questions】
10、If a client has called you and said that the web page is loading slow, what steps would you ask the client to take to diagnose the problem?【诊断问题】
【Frontend Interview Questions and Answers for experienced】
11、Why Recommended external CSS or Javascript versus inline?
What is lazy loading?
【Preparing for a Front-End Web Development Interview in 2017】
12、Reduce browser reflows and when to promote an element to the GPU.
13、Differences between the browser layout, compositing and painting.
14、When to prefetch and preload resources.何时预取和预加载资源。
八、测试
【Front-end-Developer-Interview-Questions】
1、对代码进行测试的有什么优缺点?
2、你会用什么工具测试你的代码功能?
3、单元测试与功能/集成测试的区别是什么?
九、安全
1、XSS 的概念、知道哪些解决办法(常规的就行,不必太深入)
2、escape / encodeURI / encodeURIComponent 的区别
3、CSRF 攻击的概念、防御手段
4、CSP
5、淘宝店铺装修的 CSS 过滤、JS 过滤有什么思路
6、代码质量
【Preparing for a Front-End Web Development Interview in 2017】
7、Security – when to use JSONP, CORs, and iFrame policies.
十、NodeJS
1、callback hell 以及目前的解决方案
2、用过 koa 吗?thunk 是什么?(等 koa 2 正式版出来以后这个可以不用问了)
3、什么是事件循环?Node 中有哪些类型的函数/调用是异步的?哪些是同步的?
4、怎样绑定 Node 程序到 80 端口[#绑定-node-程序到-80-端口]?
5、有哪些方法可以让 Node 程序遇到错误后自动重启
6、如何实现一个 writable stream?
7、Node.js 中怎么删文件?
8、在 Node 中直接用 MySQL 的话,客户端一定时间没有活动的话 MySQL 会断开连接,一般怎么处理这个问题?
十一、ReactJS
【ReactJS Interview Questions - Set 1】
1、ReactJS is developed by _____?
2、ReactJS is an MVC based framework?
3、Which of the following concepts is/are key to ReactJS?
4、ReactJS focuses on which of the following part when considering MVC?
5、Which of the following needs to be updated to achieve dynamic UI updates?
6、Which of the following API is a MUST for every ReactJS component?
7、'div' defined within render method is an actual DOM div element
8、Which of the following is used to pass the data from parent to child
9、A component in ReactJS could be composed of one or more inner components
10、JSX transformer is a MUST to work with ReactJS
【ReactJS Interview Questions - Set 3】
11、ReactJS renders HTML tags if the element is defined in ______
12、ReactJS renders Components (classes) if the element is defined in ______
13、To use native javascript as an attribute value, the expression should be wrapped within _____
14、Which of the following is used to trigger a UI update?
15、A component can mutate its properties as and when required
16、An owner component defines its children component within render method
17、A parent component could access or read its children components properties
18、Data flow from owner to owned components using which of the following?
19、Change or update to large number of nodes is optimized using which of the following techniques?
【ReactJS Interview Questions - Set 2】
20、One can define default values for properties, props, using which of the following method?
21、PropTypes is used for ________
22、Mixins are used to take care of cross-cutting concerns
23、Life cycle methods of a components fall under following categories?
24、Pre and post lifecycle methods of components are represented using _______
25、Which of the following mounting methods is/are invoked before the component is inserted into DOM?
26、Which of the following methods change the state of the component?
27、Input field that does not supply a value is called as _________
28、The default value of input field could be set using which of the following attribute?
29、The value of textarea is set using its children in the same way like HTML
【5 Essential React.js Interview Questions】
30、What is React? How is it different from other JS frameworks?
31、What happens during the lifecycle of a React component?
32、What can you tell me about JSX?
33、Are you familiar with Flux?
34、What are stateless components?
35、What happens when you call setState?
36、What’s the difference between an Element and a Component in React?
37、When would you use a Class Component over a Functional Component?
38、What are refs in React and why are they important?
39、What are keys in React and why are they important?
40、If you created a React element like Twitter below, what would the component definition of Twitter look like?
41、What is the difference between a controlled component and an uncontrolled component?
42、In which lifecycle event do you make AJAX requests and why?
43、What does shouldComponentUpdate do and why is it important?
44、How do you tell React to build in Production mode and what will that do?
45、Why would you use React.Children.map(props.children, () => ) instead of props.children.map(() => )
46、Describe how events are handled in React.
47、What is the difference between createElement and cloneElement?
48、What is the second argument that can optionally be passed to setState and what is its purpose?
49、What is wrong with this code?
【ReactJs Interview Questions – A MUST Have】
50、What is ReactJS? What are the advantages of using ReactJS and how it’s different from other JavaScript Frameworks? What
51、are its limitations?
52、Please explain step by step approach on how to setup environment for ReactJS?
53、What is ReactJS-JSX? What are the advantages of using JSX? Explain basic code snippet of JSX with the help of a practical example?
54、What are Components in ReactJS? Explain the Component Lifecycle with the help of a diagram explaining each component method in detail. Also, Give an example of both Stateless and Stateful components with source code?
55、What are State and Props in ReactJS? What is the difference between the two? Give a proper example of using State and Props to elaborate the concept with complete source code?
56、How to apply validation on Props in ReactJS? Apply validation in previously developed example in above question?
57、How to use Forms in ReactJS? Give an example of using Forms in ReactJS by developing a User Registration Form?
58、How to use Events in ReactJS? Give an example of using events?
59、How to set up routing in ReactJS. Explain with the help of step by step approach?
60、What is Flux concept in ReactJS? Explain various flux elements including Action, Dispatcher, Store and View. Give a simple practical example of installing and using Flux in an application?
十二、ES6和未整理的题目
【awesome-interview-questions】包括ReactJS NodeJS Network
【Frontend Resources】文档指南,HTML、CSS、JavaScript权威介绍。
【My answers to the H5BP Front End Developer Interview Questions】流行面试题目的答案
【JavaScript Garden】介绍对象、函数、数组、类型、核心、定时器