面试一个一年工作经验的前端，大家一般会问什么问题才能确实这是自己需要的前端

[devxp]

想了解一下大佬一般是怎么样面试程序员的

[xomix]

问一下这些结果吧，能说对两个以上就行：
[]+[]

[]+{}

{}+[]

{}+{}

如果能解释清楚前因后果可以做高级前端了。

至于答案你自己在控制台里面一行一行输入看。

[tobepro]

一年工作经验的，如果基本技能差不多的话，我感觉还是看沟通能力，脑力灵不灵活。实际工作中沟通能力好坏我认为是最重要的。

[whypool]

看公司需求，如果是偏页面，布局，比如活动页面，宣传页或者其他什么的，1 年左右经验差不多了，适配一下 pc 移动端什么的，重点可以放在布局和少量交互，比如基本的 get/post,jq 一些特效什么的；
如果需要功能开发，比如常见的 dashbord，表单，图表什么的，至少可以承担项目部分 taks，差不多 3 年左右经验；

[rabbbit]

@xomix
为啥最后一个 chrome 和 firefox 输出结果不同?
chrome 是 "[object Object][object Object]"
而 firefox 是 NaN

[wellsc]

@xomix 我认为这部分算是 JavaScript 的糟粕

[heyOhayo]

@xomix 我也不知道问这种问题有什么意义～

[WhatWhatWhat]

热爱加班吗

[lastpass]

@xomix 我倒是觉得你问得这一部分是作为高级前端应该尽量避免发生的 。除非你正好看过这样的面试题，否则你是再高级的前端也回答不出来吧。你也可以来试试回答 js 的各类型之间的隐式强转表吧。

[fgodt]

@wellsc 非常赞同你的看法

[bxj]

@xomix 其实如果你作为面试官你问这个问题是想考什么的？或者实际上你这个问题有经常用到吗？

[Moonless]

从需求角度考虑吧，你们找一个 一年经验的开发，是为了完成什么事情，做这个事情需要什么样的素养，另外相对的，这个人能有多少的成长潜力。然后你就知道候选人需要掌握什么技能，以及存在多少的潜力是你预期去给未来储备的 ：）

[daliusu]

@xomix 你这些东西，我觉得真没意义，一个正常的前端根本不会搞出来这种东西，就像一个正常的前端在非特殊情况根本不会用 == 一样。

一年经验只要谈得来，脑子别太差，其实就无所谓了，如果再知道一些语言特性，比如 js 的语言糟粕（这个必须的），再比如平常用的 eslint 有哪些规则，移动端开发的时候常见的问题（ 1px、点击穿透、点击延迟、三倍图、svg or png 的选择），css 方便会不会几个基础布局（圣杯），对 display、position 的几个属性掌握情况，了解不了解一些新特性（比如 flex ）。框架方面 jq 的基本原理（比如怎么实现的选择器，不用太深）、vue 的常见问题（ watch 和 computed 区别）、react 的几个生命周期，组件传值。这种我觉得就算挺不错了吧

[njwangchuan]

# 前端笔试题

## JavaScript 基础

1. 列举 JavaScript 中所有假值


2. 请写出一个函数`initArray`，接受两个参数 m 和 n，返回一个数组，它的长度是 m，每个值都是 n


3. 请写出一个函数`yesterday`，接受一个 Date 类型参数 date，返回一个 Date，正好是 date 的前一天


4. 现有二个字段：id，Number 类型； name，String 类型。取值自定义，请写出相应的 json。


5. 完成`extname`函数，它会接受一个文件名作为参数，你需要返回它的扩展名。例如，输入`emoji.png`，返回`.png`


6. 请写出以下代码的执行结果


var name = 'World!';
(() => {
if (typeof name === 'undefined') {
var name = 'Jack';
console.log('Goodbye ' + name);
} else {
console.log('Hello ' + name);
}
})();

## HTML （ 2、3 题二选一作答，4、5、6 题三选二作答）

1. 列举 HTML 中标签常用的全局属性，并描述其作用


2. 列举 HTML 中常用的块级元素，并描述其作用


3. 列举 HTML 中常用的行内元素，并描述其作用


4. 列举 HTML5 中 input 标签的新增 type 属性值，并描述其作用


5. 列举 form 标签的 method 属性和 enctype 属性值，并描述其作用


6. 列举 button 标签的 type 属性值，并描述其作用


7. 定义一个 a 标签，在浏览器新窗口中打开<http://www.baidu.com>


8. 列举常用 HTTP 状态码及其含义

## CSS

1. 有一个`div#wrapper`元素，高、宽度都未知。它其中有一个宽高都为 100px 的`div#box`元素，请你完成 CSS，使得`div#box`在`div#wrapper`内水平、垂直方向居中。


2. 韩梅梅拒绝了李雷，李雷伤心地问韩梅梅，你到底喜欢怎么样的男生。韩梅梅说，她喜欢又高、又富、又帅的男生。假设现在页面上有很多个 div 元素代表不同的男生，类名表示他们具有的特性，例如 tall 表示高，wealthy 表示富，handsome 表示帅。请你完成 CSS， 给韩梅梅喜欢的男生加上红色的边框（ 1px solid red ）。

拿去不谢，能答上 70%的，毕业 1-3 年的前端开发，愿意来南京工作的直接私信我～

[zkaip]

一年的前端可以做好多事情了, 从小见大, 一点一点深入就可以了

[zhtttyecho]

一年多经验的前端路过。。。看了一下回复，感觉自己好水，

[sunjourney]

@xomix #1 遇到问这个的面试官，可以直接走了。

[Justin13]

@sunjourney 直接走+1

[igoist]

看到评论莫名想起了一个笑话，笑得合不拢嘴

孔乙己：茴香豆的‘茴’有四样写法

[skyadmin]

@Justin13 直接走+1，简直毒瘤问题

[rabbbit]

@njwangchuan
我这种答案能合格吗?

1 NaN undefined "" [] {} null
2
function initArray(m, n){
var arr = [];
for (var i = 0;i < m;i++){
arr.push(n);
}
return arr;
}
3 忘了
4 {id: 0, name: "anna"}
5 function extname(name){return name.match(/\.[^\.]*?$/)[0]}
6 Goodbye Jack 因为块里的 var name 变量提升,所以执行的是 if 中的语句

HTML
1 不知道全局属性是啥,id class 吗?
2 div p h1 h2... body ul ol li dl hr pre form table header footer title nav
4 password 密码 mail 邮箱 radio 单选框 checkbox 复选框 reset 重置 submit 提交 text 文本
5 method 提交方法 enctype 不知道
6 不知道
7 <a href="http://www.baidu.com" target="_blank">baidu</a>
8 200 成功 404 无此资源 500 拒绝 302 重定向

CSS
1
div#wrapper{position:relative;}
div#box {position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);}
2
div.tall.wealthy.handsome {border: 1px solid red;}