码迷,mamicode.com
首页 > 其他好文 > 详细

【前端基础】基础知识

时间:2014-12-18 11:45:57      阅读:555      评论:0      收藏:0      [点我收藏+]

标签:des   style   blog   http   ar   io   os   sp   for   

https://github.com/h5bp/Front-end-Developer-Interview-Questions#contributors

1. 一般性问题 

  • What did you learn yesterday/this week?
  • What excites or interests you about coding?
  • What UI, Security, Performance, SEO, Maintainability or Technology considerations do you make while building a web application or site?
  • Talk about your preferred development environment. (OS, Editor or IDE, Browsers, Tools etc.)
  • Which version control systems are you familiar with?
  • Can you describe your workflow when you create a web page?
  • If you have 5 different stylesheets, how would you best integrate them into the site?
    • File concatenation
  • Can you describe the difference between progressive enhancement and graceful degradation?
    • Bonus points for describing feature detection
  • How would you optimize a websites assets/resources?
    • Looking for a number of solutions which can include:
      • File concatenation
      • File minification
      • CDN Hosted
      • Caching
      • etc.
  • Traditionally, why has it been better to serve site assets from multiple domains?
  • Name 3 ways to decrease page load. (perceived or actual load time)
  • If you jumped on a project and they used tabs and you used spaces, what would you do?
    • Suggest the project utilize something like EditorConfig (http://editorconfig.org)
    • Conform to the conventions (stay consistent)
    • issue :retab! command
  • Write a simple slideshow page
    • Bonus points if it does not use JS.
  • What tools do you use to test your code‘s performance?
    • Profiler, JSPerf, Dromaeo
  • If you could master one technology this year, what would it be?
  • What are the differences between Long-Polling, Websockets and SSE?
  • Explain the importance of standards and standards bodies.
  • What is FOUC? How do you avoid FOUC?
  • Do your best to describe the process from the time you type in a website‘s URL to it finishing loading on your screen.

 

2.   HTML相关

  • What‘s a doctype do?
  • What‘s the difference between standards mode and quirks mode?
  • What are the limitations when serving XHTML pages?
    • Are there any problems with serving pages as application/xhtml+xml?
  • How do you serve a page with content in multiple languages?
    • What kind of things must you be wary of when design or developing for multilingual sites?
  • What are data- attributes good for?
  • Consider HTML5 as an open web platform. What are the building blocks of HTML5?
  • Describe the difference between cookies, sessionStorage and localStorage.
  • Can you explain the difference between GET and POST?

 

3.  CSS相关

  • What is the difference between classes and IDs in CSS?
  • Describe what a "reset" CSS file does and how it‘s useful.
    • Bonus for pointing out the downsides of a "reset", and/or mentioning "normalize" as a better alternative.
  • Describe Floats and how they work.
  • Describe z-index and how stacking context is formed.
  • What are the various clearing techniques and which is appropriate for what context?
  • Explain CSS sprites, and how you would implement them on a page or site.
  • What are your favourite image replacement techniques and which do you use when?
  • CSS property hacks, conditionally included .css files, or... something else?
  • How do you serve your pages for feature-constrained browsers?
    • What techniques/processes do you use?
  • What are the different ways to visually hide content (and make it available only for screen readers)?
  • Have you ever used a grid system, and if so, what do you prefer?
  • Have you used or implemented media queries or mobile specific layouts/CSS?
  • Any familiarity with styling SVG?
  • How do you optimize your webpages for print?
  • What are some of the "gotchas" for writing efficient CSS?
  • What are the advantages/disadvantages of using CSS preprocessors? (SASS, Compass, Stylus, LESS)
    • If so, describe what you like and dislike about the CSS preprocessors you have used.
  • How would you implement a web design comp that uses non-standard fonts?
    • Webfonts (font services like: Google Webfonts, Typekit etc.)
  • Explain how a browser determines what elements match a CSS selector?
  • Explain your understanding of the box model and how you would tell the browser in CSS to render your layout in different box models.
  • What does * { box-sizing: border-box; } do? What are its advantages?
  • List as many values for the display property that you can remember.
  • What‘s the difference between inline and inline-block?
  • What‘s the difference between a relative, fixed, absolute and statically positioned element?
  • What existing CSS frameworks have you used locally, or in production? (Bootstrap, PureCSS, Foundation etc.)
    • If so, which ones? If you could, how would you change/improve them?
  • Have you played around with the new CSS Flexbox or Grid specs?
  • How is responsive design different from adaptive design?
  • Have you ever worked with retina graphics? If so, when and what techniques did you use?

 

4.  JS 问题

  • Explain event delegation
  • Explain how this works in JavaScript
  • Explain how prototypal inheritance works
  • How do you go about testing your JavaScript?
  • AMD vs. CommonJS?
  • Explain why the following doesn‘t work as an IIFE: function foo(){ }();.
    • What needs to be changed to properly make it an IIFE?
  • What‘s the difference between a variable that is: nullundefined or undeclared?
    • How would you go about checking for any of these states?
  • What is a closure, and how/why would you use one?
  • What‘s a typical use case for anonymous functions?
  • How do you organize your code? (module pattern, classical inheritance?)
  • What‘s the difference between host objects and native objects?
  • Difference between: function Person(){}var person = Person(), and var person = new Person()?
  • What‘s the difference between .call and .apply?
  • explain Function.prototype.bind?
  • When do you optimize your code?
  • When would you use document.write()?
    • Most generated ads still utilize document.write() although its use is frowned upon
  • What‘s the difference between feature detection, feature inference, and using the UA string
  • Explain AJAX in as much detail as possible
  • Explain how JSONP works (and how it‘s not really AJAX)
  • Have you ever used JavaScript templating?
    • If so, what libraries have you used? (Mustache.js, Handlebars etc.)
  • Explain "hoisting".
  • Describe event bubbling.
  • What‘s the difference between an "attribute" and a "property"?
  • Why is extending built in JavaScript objects not a good idea?
  • Difference between document load event and document ready event?
  • What is the difference between == and ===?
  • Explain the same-origin policy with regards to JavaScript.
  • Make this work:
duplicate([1,2,3,4,5]); // [1,2,3,4,5,1,2,3,4,5]
  • Why is it called a Ternary expression, what does the word "Ternary" indicate?
  • What is "use strict";? what are the advantages and disadvantages to using it?
  • Create a for loop that iterates up to 100 while outputting "fizz" at multiples of 3"buzz" at multiples of 5 and "fizzbuzz" at multiples of 3 and 5

 

6. jQuery 相关

  • Explain "chaining".
  • Explain "deferreds".
  • What are some jQuery specific optimizations you can implement?
  • What does .end() do?
  • Name 4 different values you can pass to the jQuery method.
    • Selector (string), HTML (string), Callback (function), HTMLElement, object, array, element array, jQuery Object etc.
  • What is the difference between .get()[], and .eq()?

 

7.  代码

Question: How would you make this work?

add(2, 5); // 7
add(2)(5); // 7

Question: What value is returned from the following statement?

"i‘m a lasagna hog".split("").reverse().join("");

Answer: "goh angasal a m‘i"

Question: What is the value of window.foo?

( window.foo || ( window.foo = "bar" ) );

Answer: "bar" (only if window.foo was falsey otherwise it will retain its value)

Question: What is the outcome of the two alerts below?

var foo = "Hello"; 
(function() { 
  var bar = " World"; 
  alert(foo + bar); 
})(); 
alert(foo + bar);

Answer: "Hello World" & ReferenceError: bar is not defined

Question: What is the value of foo.length?

var foo = [];
foo.push(1);
foo.push(2);

Answer: 2

 


8. 开放式问题

  • What‘s a cool thing you‘ve coded recently? What‘s something you‘ve built that you‘re proud of?
  • What are some things you like about the developer tools you use?
  • Do you have any pet projects? What kind?
  • What‘s your favorite feature of Internet Explorer?

 

9. 其他

【前端基础】基础知识

标签:des   style   blog   http   ar   io   os   sp   for   

原文地址:http://www.cnblogs.com/huxiaoyun90/p/4171280.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!