Explain event delegation

Event delegation allows us to attach a single event listener, to a parent element, that will fire for all children matching a selector, whether those children exist now or are added in the future.the underlying cause is browser's event bubbling ;

Explain how this works in JavaScript

The this object is bound at runtime based on the context in which a function is executed:

  • when used inside global functions,this is equal to window in nostrict mode and undefined in strict mode.
  • whereas this is equal to the object when called as an object method.
  • as a constructor
  • call and apply
  • bound functions
  • as dom event handler

Explain how prototypal inheritance works

Whenever a function is created, its prototype property is also created according to a specific set of rules.
When it comes to inheritance, JavaScript only has one construct: objects. Each object has an internal link to another object called its prototype. That prototype object has a prototype of its own, and so on until an object is reached with null as its prototype. null, by definition, has no prototype, and acts as the final link in this prototype chain.

How do you go about testing your JavaScript?

Grunt/Karma + Jasmine/QUnit

AMD vs. CommonJS?

What's a hashtable?

Hashtable is a data structure that associates keys with values;

Explain why the following doesn't work as an IIFE: function foo(){ }();.

What needs to be changed to properly make it an IIFE?

The most widely accepted way to tell the parser to expect a function expression is just to wrap in in parens, because in JavaScript, parens can’t contain statements. At this point, when the parser encounters the function keyword, it knows to parse it as a function expression and not a function declaration.

What's the difference between a variable that is: null, undefined or undeclared?

How would you go about checking for any of these states?

the undefined variable is a declared but has a value of undefined. To use a undeclared variable will cause an error.

What is a closure, and how/why would you use one?

Closures are functions that have access to variables from anthor function's scope.
This is often accomplished by creating a function inside a function.

What's a typical use case for anonymous functions?

Explain the "JavaScript module pattern" and when you'd use it.

Bonus points for mentioning clean namespacing.

What if your modules are namespace-less?

The module pattern use a anonymous function that returns a object.
Inside of the anonymous function, the private variables and functions are defined first.
After that, an object literal is returned as the function value. That object literal contains only properties and methods that should be public.
Since the object is defined inside the anonymous function, all of the public methods have access to the private variables and functions.

How do you organize your code? (module pattern, classical inheritance?)

I developing SPA with requirejs and MVC Framework recently. So I organize my code with AMD.

What's the difference between host objects and native objects?

  • Native objects are those objects supplied by JavaScript. Examples of these are String, Number, Array, Image, Date, Math, etc.

  • Host objects are objects that are supplied to JavaScript by the browser environment. Examples of these are window, document, forms, etc.

Difference between:

function Person(){}
var person = Person()
var person = new Person()

var-functionname-function-vs-function-functionname

What's the difference between .call and .apply?

These methods both call the function with a specific this value.
* the apply() method accepts two arguments: the value of this and an array of arguments.
* the call() method exhibits the same behavior as apply(),but arguments are passed to it differently.Using call() arguments must be enumerated specifically.

explain Function.prototype.bind?

ECMAScript 5 defines an addition method called 'bind()'.the 'bind()' method create a new function instance whose this value is bound to the value to that was passed into 'bind()'.

When do you optimize your code?

For release, we will compress and combine code.
Whenever I have a time I will review my code and refactor it.

Can you explain how inheritance works in JavaScript?

When would you use document.write()?

Most generated ads still utilize document.write() although its use is frowned upon

Use less as far as possible

What's the difference between feature detection, feature inference, and using the UA string

  • Feature Detection is to identify the browser's capabilities.
  • Feature Inference is guess whether browser has certain feature through others feature or UA string.
    • One inappropriate use of feature detection is called feature inference. Feature inference attempts to use multiple features after validating the presence of only one. The presence of one feature is inferred by the presence of another. The problem is, of course, that inference is an assumption rather than a fact, and that can lead to maintenance issues.
  • UA String is User-Agent Detection.

Explain AJAX in as much detail as possible

AJAX is short for Asynchronous Javascript + XML. The technique consisted of making server requests for additional data without unloading the page,resulting in a better user experience.

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.)

  • Handlebars
  • _.tmpl
  • $.tmpl

Explain "hoisting".

There is a preproccess or precompile in javascript runtime. and 'Hoisting' occur in the preproccess.

Function declarations and variable declarations are always moved (“hoisted”) invisibly to the top of their containing scope by the JavaScript interpreter. This means that code like this:

function foo() {
bar();
var x = 1;
}

is actually interpreted like this:

function foo() {
var x;
bar();
x = 1;
}

JavaScript-Scoping-and-Hoisting

Describe event bubbling.

Event Flow describles the order in which events are received on the page.An event has three phases to its life cycle: capture, target, and bubbling.
Event Bubbling mean that an event start at the most specific element(the deepest possible point to the document tree) and then flow upward toward the least specific node(the document);

What's the difference between an "attribute" and a "property"?

Often an attribute is used to describe the mechanism or real-world thing.

A property is used to describe the model.

In HTML / Javascript the terms get confused because DOM Elements have attributes (per the HTML source) which are backed by properties when those elements are represented as Javascript objects.

To further confuse things, changes to the properties can sometimes update the attributes.

For example, changing the element.href property will update the href attribute on the element, and that'll be reflected in a call to element.getAttribute('href').

However if you subsequently read that property, it will have been normalised to an absolute URL, even though the attribute might be a relative URL!

Why is extending built in JavaScript objects not a good idea?

Depend on the way of extending.

Why is extending built ins a good idea?

Depend on the way of extending.

Difference between document load event and document ready event?

  • ready means DOM is ready.
  • load means the page fully loaded. Includes inner frames, images etc.

What is the difference between == and ===?

The == operator will compare for equality after doing any necessary type conversions. The === operator will not do the conversion, so if two values are not the same type === will simply return false. It's this case where === will be faster, and may return a different result than ==. In all other cases performance will be the same.

Explain how you would get a query string parameter from the browser window's URL.

1.var queryString = location.search
2.parse queryString
* queryString.split("=")
* regExp
3.return specific parameter.

Explain the same-origin policy with regards to JavaScript.

Describe inheritance patterns in JavaScript.

  • Make this work:
    javascript
    [1,2,3,4,5].duplicate(); // [1,2,3,4,5,1,2,3,4,5]

    Describe a strategy for memoization (avoiding calculation repetition) in JavaScript.

Why is it called a Ternary expression, what does the word "Ternary" indicate?

What is the arity of a function?

What is "use strict";?

what are the advantages and disadvantages to using it?

JS Questions:Front-end Developer Interview Questions的更多相关文章

  1. Front-end Developer Interview Questions

    Front-end-Developer-Interview-Questions A list of helpful front-end related questions you can use to ...

  2. General Questions:Front-end Developer Interview Questions

    What did you learn yesterday/this week? Learning Angular. What excites or interests you about coding ...

  3. jQuery Questions:Front-end Developer Interview Questions

    Explain "chaining". Chaining allows us to run multiple jQuery methods (on the same element ...

  4. HTML Questions:Front-end Developer Interview Questions

    What's a doctype do? Instruct the browser to render the page. What's the difference between standard ...

  5. CSS Questions:Front-end Developer Interview Questions

    Describe what a "reset" CSS file does and how it's useful. What Is A CSS Reset? A CSS Rese ...

  6. WCF学习系列二---【WCF Interview Questions – Part 2 翻译系列】

    http://www.topwcftutorials.net/2012/09/wcf-faqs-part2.html WCF Interview Questions – Part 2 This WCF ...

  7. WCF学习系列三--【WCF Interview Questions – Part 3 翻译系列】

    http://www.topwcftutorials.net/2012/10/wcf-faqs-part3.html WCF Interview Questions – Part 3 This WCF ...

  8. WCF学习系列四--【WCF Interview Questions – Part 4 翻译系列】

    WCF Interview Questions – Part 4   This WCF service tutorial is part-4 in series of WCF Interview Qu ...

  9. 300+ Manual Testing and Selenium Interview Questions and Answers

    Manual testing is a logical approach and automation testing complements it. So both are mandatory an ...

随机推荐

  1. tar split命令

    转自:http://www.cnblogs.com/xiaouisme/archive/2011/05/25/2057435.html tar是文件打包工具,split是文件分割工具,在邮件中发送附件 ...

  2. hdu 1159:Common Subsequence(动态规划)

    Common Subsequence Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Other ...

  3. Query通过Ajax向PHP服务端发送请求并返回JSON数据

    Query通过Ajax向PHP服务端发送请求并返回JSON数据 服务端PHP读取MYSQL数据,并转换成JSON数据,传递给前端Javascript,并操作JSON数据.本文将通过实例演示了jQuer ...

  4. hdu 1215 筛法

    求小于n的n的因子之和 Sample Input 3 2 10 20Sample Output 1 8 22 #include<cstdio> #include<iostream&g ...

  5. sina sae 部署 java ssh 项目

    转自:http://jacobcookie.iteye.com/blog/1876798 1. 在sae上使用struts,需要添加的Listener,在com.company.listener中添加 ...

  6. div垂直居中 css div盒子上下垂直居中

    div垂直居中 css div盒子上下垂直居中,让DIV盒子在任何浏览器中任何分辨率的显示屏浏览器中处于水平居中和上下垂直居中. div垂直居中常用于单个盒子,如一个页面里只有一个登录布局,使用div ...

  7. sprint1的个人总结及《构建之法》8、9、10章读后感

    对sprint1的总结: 我们这次的sprint1做的挺差的,大家原来说好的分工都没有完成,也许是大家这段时间的大作业花了更多的时间,所以对这次团队任务的进度是拖慢了很多,但是团队已经认清了现阶段的问 ...

  8. POJ2553 The Bottom of a Graph(强连通分量+缩点)

    题目是问,一个有向图有多少个点v满足∀w∈V:(v→w)⇒(w→v). 把图的强连通分量缩点,那么答案显然就是所有出度为0的点. 用Tarjan找强连通分量: #include<cstdio&g ...

  9. BZOJ3821 : 玄学

    对操作建立线段树,每个节点维护一个有序的操作表,表示用$[l,r]$的操作在每段区间上的作用效果. 对于一个线段树节点,合并左右儿子信息只在该区间刚刚被填满时进行,利用归并排序,时间复杂度为$O(n\ ...

  10. iphone6来了,我该做点什么(兼容iphone6的方法)

    北京时间2014年9月10日凌晨1点,苹果公司正式发布其新一代产品 iPhone6,相信做webapp开发的同学对它是充满了好奇和等待,也担心它带来各种坑爹,高清的分辨率,升级的retina显示屏,我 ...