校招基本甘休,总括一下

校招的这段时间读书到了累累

最终大致是签订契约东京美团点评

用Word总括了过多题材。公布在那里


 

 

7-13:

1:flex项目嵌套flex项目怎么算?

您领会Flex项目也足以改为Flex容器吗?是的,是可能的!

您想嵌套多少深度就嵌套多少深度(可是理智的做法是保持二个靠边的水准)。

2:总结flexbox

3:规划布局

4:CSS选择器

5:现代种种布局

6:Hexo

7:react+redux书

 

7-17:

1:e.target.parentNode.remove();成功,查询一下JS原生的remove方法

2:复习JS DOM的原生操作方法,比如innerHTML(),insertBefore()等

3:技术之瞳

4:jquery的each,map等方法

5:数组和指标的浓淡拷贝

http://blog.csdn.net/fungleo/article/details/54931379

 

7-18

1:MD5那种JS文件不能间接在index.js里面载入,要求用webpack到场的原由和什么进入?

2:webpack2.2华语文书档案 http://www.css88.com/doc/webpack2/

4:screenX,pageX,client,offset…

http://www.cnblogs.com/yehuabin/archive/2013/03/07/2946004.html

7:js怎么编写鼠标的右击事件

https://zhidao.baidu.com/question/1111401816718591899.html

 

7.24

1.checked风云的变化<input type=”checkbox”
checked={this.state.checked} onChange={this.checkedChangeHandler}
/>记住账号1</span>

2:backbone路由的卷入怎么办的

3:基于 CentOS 搭建微信小程序服务

 

7.25

1.JS原生的onclick事件写法

2:左右添加

3接口不重复难点

 

7.26

作者:DaphneMoMo
链接:https://www.nowcoder.com/discuss/18530?type=2&order=3&pos=55&page=1

一面

① 、 
window.onload和$(document).ready()的界别,浏览器加载转圈结束时哪个时间点?

  $(document).ready()方法和window.onload方法有类同的效率,不过在履行时机方面是有分其他。window.onload方法是子呀网页中的全数因素(包蕴成分的兼具涉嫌的文件)完全加载到浏览器后才实施,即javascript此能够访问网页中的任何因素。而因而jquery中的$(document).ready()方法注册的刻钟处理程序,在DOM完全就绪时就足以被调用。此时,网页的具备因素对jquery而言都以足以访问的,可是,那并不意味这么些成分关联的文书都曾经下载实现。

  举多个例子,有三个大型的图库网站,为网页中的全部图片添加有个别行为,例如单机图片后让他潜伏或展现。借使使用window.onload方法来处理,那么用户必须等到每一副图片都加载完结后,才能够进行操作。借使采用jquery中的$(document).ready()方法来进展设置,只要DOM就绪就能够操作了,不须求拭目以待全部图片加载达成。明显,吧网页解析为DOM树的快慢比呢网页中的全部关乎文件加载完结的素的快很多。

  其余,供给专注一点,由于在$(document).ready()方法内注册的风云,只要DOM就绪就会被实施,因而大概此时因素的关系文件未下载完。例如与图片有关的HTML下载实现,并且已经即诶下为DOM树了,但很有也许图片还未加载达成,全部例如图片的莫斯中国科学技术大学学和增长幅度那样的性质此时比自然有效。要缓解这么些题材,可以行使Jquery中另二个关于页面加载的不二法门—–load()方法。load()方法会在要素的onload事件中绑定三个处理函数。要是处理函数绑定给window对象,则会在装有内容(包蕴窗口。框架,对象和图像等)加载实现后触发,假使处理函数绑定在要素上,则会在要素的被容加载完成后加载。jquery代码如下:

1

2

3

4

$(window).load(function(){

//代码

 

});

  等价于javascript中的以下代码:

1

2

3

4

window.onload=function(){

     

//代码

}

 

贰 、  form表单当前页面无刷新提交  <form target=””>  iframe

http://www.cnblogs.com/yevon/p/about\_target\_attribute\_of\_form.html

三 、  setTimeout和setInterval不一样,怎么样相互实现?

http://blog.csdn.net/baidu_24024601/article/details/51862488

参考资料:javascript高级程序设计第②版:重复定时器

四 、 
怎样制止多再次来到调—promise,promise简单描述一下,如何在外部实行resolve()

法定文书档案

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Promise

         通俗解释

http://www.cnblogs.com/lvdabao/p/es6-promise-1.html

         感性明白

http://www.zhangxinxu.com/wordpress/2014/02/es6-javascript-promise-%E6%84%9F%E6%80%A7%E8%AE%A4%E7%9F%A5/

大家重临总计一下,异步回调的观念做法有多个难题:

  1. 嵌套层次很深,难以保险

  2. 代码难以复用

  3. 库房被毁损,不能够寻常检索,也无从经常使用 try/catch/throw

  4. 几个异步计算同时开展,无法预料实现顺序,必须依赖外层功效域的变量,有

误操作风险

Promise保留异步在无阻塞上的优势,又能让我们写代码写的更载歌载舞

⑤ 、  margin坍塌?水平方向会不会坍塌

http://www.cnblogs.com/hugejinfan/p/5901320.html水平方向不会现出margin坍塌 

六 、  伪类和伪成分差距

http://www.cnblogs.com/ihardcoder/p/5294927.html

容易易行来说,伪元素创设了三个虚构容器,这一个容器不蕴含其余DOM成分,可是足以涵盖内容。其余,开发者还是能够为伪元素定制样式。

捌 、数组去重

http://blog.csdn.net/chengxuyuan20100425/article/details/8497277

 作者总共想出了二种算法来贯彻这几个指标:

1.  Array.prototype.unique1 = function()

2.  {

3.    var n = []; //一个新的临时数组

4.    for(var i = 0; i < this.length; i++) //遍历当前数组

5.    {

6.           //如果当前数组的第i已经保存进了临时数组,那么跳过,

7.           //否则把当前项push到临时数组里面

8.           if (n.indexOf(this[i]) == -1) n.push(this[i]);

9.    }

10.  return n;

11.}

12.Array.prototype.unique2 = function()

13.{

14.  var n = {},r=[]; //n为hash表,r为临时数组

15.  for(var i = 0; i < this.length; i++) //遍历当前数组

16.  {

17.         if (!n[this[i]]) //如果hash表中没有当前项

18.         {

19.                 n[this[i]] = true; //存入hash表

20.                 r.push(this[i]); //把当前数组的当前项push到临时数组里面

21.         }

22.  }

23.  return r;

24.}

25.Array.prototype.unique3 = function()

26.{

27.  var n = [this[0]]; //结果数组

28.  for(var i = 1; i < this.length; i++) //从第二项开始遍历

29.  {

30.         //如果当前数组的第i项在当前数组中第一次出现的位置不是i,

31.         //那么表示第i项是重复的,忽略掉。否则存入结果数组

32.         if (this.indexOf(this[i]) == i) n.push(this[i]);

33.  }

34.  return n;

35.}

九 、使用flex布局实现三等分,左右七个要素分别贴到左侧和左侧,垂直居中

flex{1} flex{1} flex{1}

⑩ 、平时什么学前端的,看了怎样书,关心了怎么着群众号

二面

1、  说下对this的理解

http://www.jb51.net/article/77519.htm

2、  实现bind函数

http://blog.csdn.net/u010552788/article/details/50850453手写bind()函数,理解MDN上的正儿八经Polyfill,bind和new,柯里化)

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Function/bind
(bind mdn)

http://www.cnblogs.com/libin-1/p/6069031.html(理解JS中的apply,call和bind方法)

http://www.cnblogs.com/admos/p/4453259.html  (bind函数使用apply的落到实处)

三 、数组和链表不同,分别适合哪些数据结构

数组的特征是连忙随机走访
链表的特色是全速插入删除

4、对mvc的理解

⑤ 、描述2个记念最深的类别,在个中担任的剧中人物,消除什么难题

6、http状态码。。。401和403区别?

400(错误请求)

服务器不理解请求的语法。

401(未授权)

请求要求身份验证。对于登录后请求的网页,服务器可能返回此响应。

403(禁止)

服务器拒绝请求。

1xx(临时响应)2xx(成功)3xx(重定向)4xx(请求错误)5xx(服务器错误)

柒 、  描述下二分查找

http://www.cnblogs.com/zuojiayi/p/6229902.html

八 、  在函数中利用array.prototype.slice.call(arguments,1);的作用?

arguments是各样函数在运作的时候自动获取的3个像样数组的指标(传入函数的参数从0起初按数字排列,而且有length)。比如当您
func(‘a’, ‘b’, ‘c’) 的时候,func里面获取的arguments[0] 是
‘a’,arguments[1] 是
‘b’,依次类推。但难题在于这一个arguments对象实际并不是Array,所以并未slice方法。Array.prototype.slice.call(
)能够直接对其落实slice的效果,而且回去的结果是当真的Array。

http://www.cnblogs.com/dingxiaoyue/p/4948166.html

https://www.zhihu.com/question/21351604

三面

一 、为啥选取前者,怎么样学习的,看了何等书,《js高级程序设计》和《你不精通的js》有怎么样界别,看书,看博客,看群众号三者的大运是何许分配的

② 、怎么样评价bat

三 、描述下在实习中做过的多个项目,消除了怎么难点,在中间担任了怎么角色?这些历程存在什么样难点,有哪些值得立异的地点

④ 、怎样对待加班,若是有个项目需求一连3个月加班,你怎么看

⑤ 、境遇的压力最大的一件事是哪些?如何缓解的

⑥ 、平日有何爱好

柒 、自己有待立异的地点

八 、n长的数组放入n-1个数,无法重新,找出卓殊缺点和失误的数

思路:数组之和减去自然数之和,结果就是尤其重复的。

等差数列求和公式

 

 

玖 、手里有怎么着offer

⑩ 、你对于第①份工作最强调的多个地点是如何

1壹 、如何评论现在的前端

1贰 、有怎么样难题

一中午面了靠近四个钟头完结了三面,当天夜晚就吸收接纳了三面面试官的电话机说面试通过了,炒鸡心旷神怡,校招这么久以来收到的第③个offer~后来又通晓到是凤巢部门,于是就决定去那里了

 

 

7-28

1:JS异步开发教程

https://meathill.gitbooks.io/javascript-async-tutorial/content/

 

7-31

1:本身的产品

2:JavaScript创制对象的两种艺术

http://blog.csdn.net/u010552788/article/details/50849191

3:书计算一下 技术之瞳/react/JS高级/你不晓得的JS

4:

 

1、手写jsonp的实现

贰 、手写链表尾数第K个查找

 

找寻单链表最后多少个第m个结点,须要时间复杂度为O(n).(提醒,使用双指南针)


解题思路: 
常规思路为先拿到链表的长度N,然后回来N-k+一地点处的结点即可。可是中要求遍历两次链表。 
我们使用另一种算法,设定七个指针p1,p2.将那八个指针都向首个结点,让p1先走k步,然后五个指针一起向后运动,当p1到达最终二个结点时,p2指针刚好指向链表的尾数第k个结点。

 

叁 、  http请求行,请求头,请求体,cookie在哪些里面?url在何地面?

http://blog.csdn.net/u010256388/article/details/68491509

cookie在呼吁头,url就像是在请求行?

四 、  原型链的诠释

原型链是作为落实持续的关键形式,基本思维是应用原型让二个引用类型继承另二个引用类型的习性和章程。

五 、 
对闭包的明亮,完成1个爆出内部变量,而且外部能够访问修改的函数(get和set,闭包完成)

http://blog.csdn.net/baple/article/details/42495361

和谐写得set的例子

var f1 = function (x) {

         var a = 1;

         function f2 (b){

                   a =  a+b ;

                   return a

         }

         return f2

 }

 

var x = f1();

var xx = x(2);

闭包正是能够读取其余函数内部变量的函数

7、{}=={}?   []==[]? null==undefined?

{} == {} false

[] == [] false

null == undefined true

null == null true

undefined == undefined true

解答

[] == [] 那个好精晓. 当多个值都以目的 (引用值) 时,
比较的是七个引用值在内部存款和储蓄器中是不是是同2个对象. 因为此 [] 非彼 [],
尽管同为空数组, 确是七个互不相干的空数组, 自然 == 为 false.

 

null 表示三个值被定义了,定义为“空值”;
undefined 代表向来不设有定义。

所以设置3个值为 null 是合理的,如
objA.valueA = null;
但设置三个值为 undefined 是不成立的

 

⑥ 、  基本的数据类型

ECMAScript中有5中回顾数据类型(也叫做基本数据类型): UndefinedNullBooleanNumberString。还有第11中学复杂的数据类型————ObjectObject实为上是由一组冬天的名值对构成的。Array,Date,Function+基本包装类Number,String,Boolean均归于Object

 

七 、  基本的两列自适应布局

察觉有了position的性质,不再与健康文书档案流中的成分互相影响

.sub, .extra {

    position: absolute;

    top: 0;

    width: 200px;

}

.sub {

    left: 0;

    background-color: yellow;

}

.extra {

    right: 0;

    background-color: black;

}

.main {

background-color: blue;

    margin: 0 200px;

}

<div class=”sub”>left</div>

<div class=”main”>main</div>

<div class=”extra”>right</div>

 

1一 、OSI模型,HTTP,TCP,UDP分别在怎么着层

OSI 分层( 7 层):物理层、数据链路层、网络层、传输层、会话层、表示层、应用层

物理层与数据链路层为地点的协议族提供劳动大家一般很少接触。IP在网络层,TCP/UDP在传输层,应用层一般是我们平时接触的东西HTTP在行使层A本田CR-VP(地址解析协议)在链路层

1二 、网站质量优化

CDN是什么样?使用CDN有哪些优势?

https://www.zhihu.com/question/36514327

1叁 、快排的年华复杂度和空中复杂度。

var quicksort = function(arr){

         if(arr.length<=1){

                   return arr

         }

         var num = Math.floor(arr.length/2);

         var item = arr.splice(num,1);  

         var arrleft=[];

         var arrright=[];

         for (var i = 0; i < arr.length; i++) {

                   if(arr[i]<item[0]){

                            arrleft.push(arr[i]);

                   }

                   else{

                            arrright.push(arr[i]);

                   }

         }

         return
quicksort(arrleft).concat(item[0],quicksort(arrright));

}

 

console.log(quicksort([1,2,3,5,4]));

留意一下i < arr.length无法是<=,不然有一个undefined就会极其循环

一面问的基础知识很多,可是基本都答出来了,面完后有个别蒙逼。

二面是一位女面试官,给的下压力相当的大,人相比得体,不苟言笑,后来听别人说二面是压力面,二面问了48分钟。

二 、在jquery方法和原型下面添加方法的区分和促成($.extend,$.fn.extend),以及jquery对象的贯彻(return
new jQuery.fn.init)

http://caibaojian.com/jquery-extend-and-jquery-fn-extend.html

为jQuery类添加类方法,能够精通为丰盛静态方法

对jQuery.prototype进得扩充,正是为jQuery类添加“成员函数”。jQuery类的实例可以应用那些“成员函数”。

 

jQuery 2.0.3 源码分析core –
全部架构

http://www.cnblogs.com/aaronjs/p/3278578.html

③ 、手写3个递归函数(考察arguments.callee,以及arguments的诠释)

// arguments.callee 是叁个针对正在执行函数的指针

function factorial(num)

{ if (num <= 1) { return 1; }

else { return num * arguments.callee(num – 1); } }

caller

在七个函数调用另二个函数时,被调用函数会自动生成贰个caller属性,指向调用它的函数对象。要是该函数当前未被调用,或并非被其余函数调用,则caller为null。

 callee

当函数被调用时,它的arguments.callee对象就会指向自个儿,也便是三个对友好的引用。
出于arguments在函数被调用时才有效,由此arguments.callee在函数未调用时是不存在的(即null.callee),且解引用它会生出十三分。

 

四 、对前者路由的敞亮?前后端路由的分别?

1,什么是前端路由?
路由是依照不一致的 url 地址展现不相同的剧情或页面
前端路由正是把分歧路由对应分化的剧情或页面的天职交给前端来做,在此之前是透过服务端依据url 的不等再次来到不一样的页面达成的。
2,什么日期利用前端路由?
在单页面应用,抢先一半页面结构不变,只变动一些剧情的采用

3,后端路由:

每跳转到分化的URL,都以重复访问服务端,然后服务端重临页面,页面也得以是服务端获取数据,然后和模板组合,重返HTML,也能够是一贯回到模板HTML,然后由前端js再去乞请数据,使用前端模板和数目实行重组,生成想要的HTML。

4.5、怎么着记住OSI七层协议模型

http://blog.csdn.net/hellochenlu/article/details/52895341

Physical Data Link Network Transport Session Presentation
Application

伍 、介绍一下webpack和gulp,以及项目中现实的行使

http://www.cnblogs.com/lovesong/p/6413546.html

6、你对es6的了解

http://www.alloyteam.com/2016/03/es6-front-end-developers-will-have-to-know-the-top-ten-properties/comment-page-1/#comments

  1. Default Parameters(暗中认可参数) in ES6
  2. Template Literals (模板文本)in ES6
  3. Multi-line Strings (多行字符串)in ES6
  4. Destructuring Assignment (解构赋值)in ES6
  5. Enhanced Object Literals (增强的靶子文本)in ES6
  6. Arrow Functions (箭头函数)in ES6
  7. Promises in ES6
  8. Block-Scoped Constructs Let and Const(块功效域构造Let and Const)
  9. Classes(类) in ES6
  10. Modules(模块) in ES6

七 、解释一下vue和react,以及异同点

https://www.zhihu.com/question/31585377

读书一下vue

⑧ 、  前后端分离的含义以及对前者工程化的了然

https://www.zhihu.com/question/28207685 –前后端分离

https://www.zhihu.com/question/24558375 –前端工程化首要应该从

模块化:webpack解惑:require的二种用法

组件化:组件化实际上是一种依据模板(HTML)+样式(CSS)+逻辑(JS)3个人一体的花样对面向对象的特别抽象

规范化:规范化其实是工程化中很重大的七个有的,项目初期规范制定的好坏会直接影响到末代的支出品质。

自己能体会通晓的有以下部分内容:

目录结构的创建

编码规范

上下端接口规范

文书档案规范

零件管理

Git分支管理

Commit描述规范

定期CodeReview

视觉图标规范

自动化:作者认为,前端工程化的很多脏活累活都应有交由自动化工具来形成。

### 图标合并

无须再用PS拼Coca Cola图了,统一走Webpack吧;

毫无再用Icomoon了,统一走Webpack吧。

### 持续集成

### 自动化营造

### 自动化布署

### 自动化测试

⑩ 、使用css完成一个三角

#triangle-up {
    width: 0;
    height: 0;
    border-left: 50px solid transparent;
    border-right: 50px solid transparent;
    border-bottom: 100px solid red;
}

大幅一定要为0,left,right是三角形的宗旨往左往右长度;bottom是三角形的高;

10.5CSS3D效果?

1③ 、解释一下call函数和apply函数的效应,以及用法

一 、介绍一下祥和

② 、你说本人抗压能力强,具体表现在哪里?

叁 、对前者前景的展望,未来前端会怎么提升

④ 、手写第②遍面试没有写出来的链表难题,须要用es6写

⑤ 、日常是怎么学技术的?

六 、经常高校内部时间是怎么设计的?

⑦ 、接下去有何陈设?那个学期和下个学期的陈设是?

⑧ 、项目中相遇的难题,可能你学习路上的难处

九 、你是因此什么样艺术和路径来学习前端的

1贰 、你在公司中更倾向于怎样剧中人物?

13、对java的理解

1④ 、介绍node.js,并且介绍你用它做的档次

 

百度外卖

 

一 、介绍本人

贰 、手写贰个js的深克隆

③ 、for函数里面setTimeout异步难点

至于for循环里面异步操作的题材

for 循环中的setTimeout(function(){})异步难点,为啥改var 为let就足以消除?

 深入了然JavaScript编制程序中的同步与异步机制

四 、归并排序

 

① 、达成三个数组的排序合并,作者一开头先统一再排序,他不乐意,然后本身用了近似插入排序的不二法门。

二 、手写三个原生ajax

https://segmentfault.com/a/1190000008097712

xmlhttp=newXMLHttpRequest();

xmlhttp.onreadystatechange=state_Change

xmlhttp.open(“GET”,“/example/xdom/note.xml”,true);

xmlhttp.send(null);

function state_Change()

{

if(xmlhttp.readyState==4)

{

`**if** (xmlhttp.status==200)`

{

// 那里应该是函数具体的逻辑“

}

else

{

alert(“Problem retrieving XML data”);

}

}

}

⑥ 、手写达成jquery里面包车型客车insertAfter

结合nextSibling和insertBefore来实现

9、  AMD和CMD,commonJS的区别

AMD正视前置;CMD就近依赖(捐躯质量来换取越多支出方便人民群众);

NodeJS是CommonJS规范的贯彻;CommonJS的这么些Modules规范设计之初是为了server端设计的,它是三个手拉手的形式。可是那种方式并不吻合于浏览器端,大家着想一下一旦浏览器联合形式3个一个加载模块,那么打开将会变得13分的慢,所以英特尔正是为着这一个出生,它最大的特点正是足以异步的法门加载模块。(CMD也是异步的)
那么RequrieJS其实正是英特尔以后用的最广大,最流行的兑现。

 

8-1

  1. 饥人谷
  2. 萌鹿简历

 

8-2

  1. 怎么写一个模态框

https://my.oschina.net/aiguozhe/blog/279992

  1. 面试什么的

http://www.cnblogs.com/iceb/p/7238785.html

小编:小芋头君
链接:https://www.zhihu.com/question/41986174/answer/94241086
来源:知乎
文章权归小编全数。商业转载请联系笔者拿到授权,非商业转发请表明出处。

不讲那一个题材有没有含义,在作者看来的确没有意义,可是那几个的根源其实不是介于那个难点是或不是有意义。
而在于

您可见支配面试官问出您擅长回答的题目?

用作一名面试官,笔者面试过许多少人了也算,首先,挑选简历的时候自个儿就会选择自身能问出难题的简历,假使三个简历看了解后笔者都问不出什么针对性的题目,只好随口问3个“闭包怎么写”那样的难点来说,那个简历也没怎么面试的须要性了。所以率先关就是,简历有能够让面试官针对性提问的始末,有亮眼的内容,有沉思有总括,那样大家就能够和颜悦色的实行一场互动交流的面试了,而不是给您一张试卷,你挨个写代码写算法。

下一场,到了实地面试,同样,你必要教导面试官来提问。首先是简历上反映的内容,然后是让您自作者介绍的时候,一定要掀起这一个机遇!!!!不要说些没用的,你喜欢打球什么的,笔者都不关心!!让您自笔者介绍,是给你3个机遇,你来开启一下大家的话题!其实就恍如于述职,你讲讲你过去一段时间做过的有意义的事体,符合您一向的事体,不管是技术上晋级,还是学习了新东西,仍旧你带项目作分析,照旧做了怎么优化,做了何等升高共青团和少先队功能的工具,可能是你是管理者,你怎样管理团队,怎么样升级团队成效,怎么着考虑升高社团完全技术力量影响力等等等等。那便是太重庆大学了。

这个宣布都是从你想表现的投机独具的地道特质作为起源来总结的,

平凡多思考下怎么样的工程师特质是豪门期待见到的,

那么些是您要做的,是你要总括的,正是你下次面试的时候要抒发的

 

假诺您的简历和您的自作者介绍都没事儿说头,那倒霉意思,为了应景一下,小编有个面试题列表,小编只可以从里边随便挑一条出来问,都以很形式化的标题,其实您答应对了也没卵用,只是汇集一下地方而已啦,究竟那些标题不管google一下就清楚操纵了。

说的都以大实话,不管是做面试官,依然去面试,想通晓本身要表达出什么事物来,想通晓本人想要获得什么消息,都如出一辙,凡事就怕用心!

 

8-3

  1. HTTP协议下POST和GET的区别

http://blog.csdn.net/wangzhilife/article/details/12440089

2:浏览器缓存机制

http://www.cnblogs.com/slly/p/6732749.html

3:图片轮播

锋利的JQUERY

C:\Users\Administrator\Downloads\[jb51.net]fengli_jquery\实例下载\04第四章\第五章例子\10-实例

3.5Jquery的show()很简单就足以有从上往下的渐变效果,怎么形成的?

http://www.zhangxinxu.com/wordpress/2012/10/more-display-show-hide-tranisition/

show()使用的css3动画功能从上往下必要高度,Jquery算中度的办法还不晓得

4:React拖拽

http://www.cnblogs.com/LuckyWinty/p/5347559.html

5.您知道哪些是CSS预处理么

CSS 预处理器定义了一种新的言语,其主干思想是,用一种专门的编制程序语言,为
CSS 扩张了一部分编制程序的表征,将 CSS
作为对象转移文书,然后开发者就尽管利用那种语言进行编码工作。

初始的说,“CSS 预处理器用一种尤其的编制程序语言,进行 Web
页面样式设计,然后再编写翻译成不荒谬的 CSS 文件,以供项目接纳。CSS 预处理器为
CSS 扩大部分编制程序的性格,无需考虑浏览器的包容性难点”,例如你可以在 CSS
中运用变量简言之的逻辑程序函数(如左侧代码编辑器中就选拔了变量$color)等等在编制程序语言中的一些中央特点,能够让您的
CSS 进而从简适应性更强可读性更佳更便于代码的保障等许多功利。结构清晰,便于扩展,轻松达成多重继承

6.有关变更的法则和办事措施,你能够描述一下么

变迁成分脱离文档流,不占用空间。浮动元素境遇包涵它的边框或许变化元素的边框停留。

7.变型会爆发什么样震慑呢,要怎么处理?

父成分的冲天不能够被撑开,影响与父成分同级的成分
与转变成分同级的非浮动成分(内联元素)会跟随其后
要不是率先个成分浮动,则该因素在此以前的成分也急需转变,不然会影响页面彰显的构造

焚薮而田措施:
使用CSS中的clear:both;属性来排除成分的变通可化解贰 、3难点,对于难点1,添加如下样式,给父成分添加clearfix样式:

.clearfix:after{content: “.”;display: block;height: 0;clear:
both;visibility: hidden;}

.clearfix{display: inline-block;} /* for IE/Mac */

 

8.您询问什么选择器?以及那一个选拔器的行使意况?

9.你知道它们的权重怎么总计么

  1. 先是等:代表内联样式,如: style=””,权值为1000。
  2. 第二等:代表ID选择器,如:#content,权值为100。
  3. 其三等:代表类,伪类和质量选拔器,如.content,权值为10。
  4. 第五等:代表类型选取器和伪成分采用器,如div p,权值为1。

12.你从jQuery学到了怎么着?(跳坑了竟说本身看过源代码…然后不会说了..)

16.说说函数表明式和函数注明的界别(变量提高和函数提高)

http://blog.csdn.net/qq673318522/article/details/50810650

18.你了解attribute和property的界别么

http://www.cnblogs.com/cndotabestdota/p/5706562.html

要素上的属性(包蕴自定义)都以attribute,但唯有id,title,class等还要也是property,attribute正是DOM元素自带的性质,property是这些因素作为指标附加的情节,比如firstChild等

19.常常有理解web质量么,一般要关爱怎么着点?

https://www.zhihu.com/question/21658448 (很重要!!!!!)

21.Taobao那里的商品项,如图片,滚动到了才加载,你明白怎么落到实处么

难题19的zhihu回答里面有个Lazy Load Images好像有点类似

 

8-4

  1. 前端路由和单页路由?

①  
Backbone单页路由正是用①href=”#xx”或②router.navigate触发路由后实行回调函数,更改模板重新渲染。

②Hash路由的贯彻https://segmentfault.com/a/1190000007422616

hash 属性是1个可读可写的字符串,该字符串是 UOdysseyL 的锚部分(从 #
号开头的部分)。

语法:location.hash=anchorname

前者的路由决定:hash和history(HTML5新特性)

js页面刷新跳转的两种方法及界别

http://blog.csdn.net/fb408487792/article/details/41248675

window.location.href=”http://shanghepinpai.com“; 

a标签的href=”javascript:void(0)”和href=”#”的区别

http://www.cnblogs.com/pp-cat/p/4308736.html

若果页面里面有id为nogo的要素,点击那一个链接后,锚点机制会功能,页面贴齐那些成分上缘

  1. 牛客网校招日历

https://www.nowcoder.com/activity/campus2018

  1. ES6解构赋值,箭头函数

http://es6.ruanyifeng.com/\#docs/destructuring

字符串也能够解构赋值。那是因为那时候,字符串被转换到了四个近乎数组的靶子。

Object(‘abc’) // {0: “a”, 1: “b”, 2: “c”, length: 3, [[PrimitiveValue]]: “abc”}

 

let arr = [1, 2, 3];
let {0 : first, [arr.length – 1] : last} = arr;
first // 1
last // 3

4:廖雪峰JS

https://www.liaoxuefeng.com/wiki/001434446689867b27157e896e74d51a89c25cc8b43bdb3000/0014345008539155e93fc16046d4bb7854943814c4f9dc2000

  1. console.trace()会打字与印刷出函数调用栈的音讯

 

8-7

1:js关于for循环中的闭包难题?

for(var i=0,arr=[];i<=3;i++) {
arr.push(function(){alert(i)});
}
arr[0](); // ?? 结果不是0
arr[1](); // ?? 全是4
改装后
for(var i=0,arr=[];i<=3;i++) {
arr.push(
(function(i){
return function(){
alert(i);
}
})(i)
);
}
选取闭包能够消除了,为啥第二次代码中的i读取的平素是I变量的最后的结果吧?
尤其大神能给分析一下率先段代码的执行的具体步骤呢?

https://www.zhihu.com/question/33468703

 

2:为啥需求闭包呢

有的变量无法共享和长久的保存,而全局变量大概引致变量污染,所以我们期望有一种体制既能够暂劳永逸的保留变量又不会造成全局污染。

特点

侵夺越来越多内部存款和储蓄器

不易于被放出

何时使用

既想反复使用,又想防止全局污染

什么样使用

1.定义外层函数,封装被保卫安全的局地变量。
2.定义内层函数,执行对外表函数变量的操作。
3.外层函数再次回到内层函数的指标,并且外层函数被调用,结果保存在1个大局的变量中。

https://zhuanlan.zhihu.com/p/27857268

 

3:

var k = (function fun(x) {

if(x>0) {

    x–;

    console.log(x);

} else{

         console.log(“lala”);

   return “lala”;

}

    fun(x); 

})(3)

console.trace(k);

为啥打印结果是undefined?

 

k正是你的fun(3)fun(3) 依照你代码,没有显式给出再次回到值,私下认可正是回到的 undefined 。

一旦你要做递归的话,应该 给 里面包车型大巴 fun(x) 加上 return
变成 return fun(x); 如此就能让k为 lala了。

 

4:
a标签的href=”javascript:void(0)”和href=”#”的区别

http://www.cnblogs.com/pp-cat/p/4308736.html

若是页面里面有id为nogo的因素,点击这一个链接后,锚点机制会成效,页面贴齐那些因素上缘

 

5:依然真弄一下原生JS和JQUEKugaY 然后从文章入手写3个工程

廖雪峰+MDN+JS高级+你不知情的JS+JQUELX570Y

 

6:廖雪峰

1.字符串:多行字符串,模板字符串

2.对象:

中括号运算符总是能代替点运算符。但点运算符却不肯定能一切替代中括号运算符。
中括号运算符能够用字符串变量的内容作为属性名。点运算符无法。

var test={aa:12,bb:34};//或者var test={};

var cc= “acqId”

test[cc]=12;

test[“cc”]=13;

console.log(test[cc]);//13

console.log(test[“cc”]);//12

console.log(test[aa]);//报错
中括号运算符能够用纯数字为属性名。点运算符无法。
中括号运算符能够用js的根本字和保留字作为属性名。点运算符不可能。

 

一旦大家要检查和测试xiaoming是或不是享有某一性子,能够用in操作符:

‘name’`**in** xiaoming; // `true

不过要小心,假若in判定二个性情存在,那么些特性不肯定是xiaoming的,它大概是xiaoming后续取得的:

‘toString’`**in** xiaoming; // `true

因为toString定义在object对象中,而具备目标最后都会在原型链上指向object,所以xiaoming也拥有toString属性。

要咬定1天性能是或不是是xiaoming自作者具有的,而不是再三再四取得的,能够用hasOwnProperty()方法:

xiaoming.hasOwnProperty(‘name’);//true

for…in 讲话用于遍历数组或然目的的品质

 

8-8

3.ES6新类型Map和Set

起初化Map必要一个二维数组,或然直接早先化1个空Map。Map具有以下方法:

var m = new Map(); // 空Map

m.set(‘Adam’, 67); // 添加新的key-value

m.set(‘Bob’, 59);

m.has(‘Adam’); // 是不是留存key ‘Adam’: true

m.get(‘Adam’); // 67

m.delete(‘Adam’); // 删除key ‘Adam’

m.get(‘Adam’); // undefined

var m = new Map([[‘Michael’, 95], [‘Bob’, 75], [‘Tracy’,
85]]);

不同于object的是JavaScript的目的有个小标题,就是键必须是字符串。但实质上Number也许其余数据类型作为键也是非常合理的。

Map是一组键值对的结构,具有极快的搜寻速度。

 

Set

SetMap接近,也是一组key的聚集,但不存款和储蓄value。是因为key无法再度,所以,在Set中,没有重新的key。

要开创3个Set,要求提供一个Array作为输入,恐怕直接开立2个空Set

vars1 =newSet();// 空Set

vars2 =newSet([1,2,3]);// 含1, 2, 3

通过add(key)艺术能够添加成分到Set中,能够再一次添加,但不会有机能:

>>> s.add(4)

>>> s

{1,2,3,4}

>>> s.add(4)

>>> s

{1,2,3,4}

通过delete(key)办法能够去除成分:

 

ES6规范引入了新的iterable类型,ArrayMapSet都属于iterable类型。

具有iterable类型的集纳能够经过新的for ... of循环来遍历。

for ... of巡回是ES6引入的新的语法

 

您或者会有问号,for ... of循环和for ... in巡回有什么差距?

for ... in巡回由于历史遗留难点,它遍历的其实是指标的脾性名称。三个Array数组实际上也是一个对象,它的各类元素的目录被视为1个天性。

当大家手动给Array对象添加了额外的习性后,for ... in循环将推动出人意料的意想不到效果:

for ... of巡回则统统修复了这一个标题,它只循环集合本身的成分:

 

那正是为啥要引入新的for ... of循环。

只是,更好的点子是间接行使iterable内置的forEach方法,它接受一个函数,每回迭代就机关回调该函数。以Array为例:

vara = [‘A’,‘B’,‘C’];

a.forEach(function (element, index, array) {“

// element: 本着当前因素的值

// index: 本着当前目录

// array: 指向Array对象自作者

alert(element);

});

SetArray类似,但Set从不索引,由此回调函数的前三个参数都以因素自身

 

  1. 函数

 

①作用域

名字空间

大局变量会绑定到window上,差异的JavaScript文件假设运用了一如既往的全局变量,大概定义了一如既往名字的顶层函数,都会促成命名争持,并且很难被发觉。

减掉冲突的三个格局是把温馨的兼具变量和函数全体绑定到三个全局变量中。例如:

// 唯一的大局变量MYAPP:

varMYAPP = {};

// 任何变量:

MYAPP.name
=
‘myapp’;

MYAPP.version
=
1.0;

// 别的函数:

MYAPP.foo
=
function () {“

`**return** 'foo';`

};

把温馨的代码全部放入唯一的名字空间MYAPP中,会大大裁减全局变量争辩的或是。

成都百货上千有名的JavaScript库都以如此干的:jQuery,YUI,underscore等等。

 

②变量

由于varlet发明的是变量,借使要注脚一(Wissu)个常量,在ES6在此以前是12分的,大家常见用全数大写的变量来代表“这是二个常量,不要改动它的值”:

varPI =3.14;

ES6标准引入了新的重要字const来定义常量,constlet都怀有块级功能域:

‘use strict’;

constPI =3.14;

PI
=
3;// 一点浏览器不报错,可是无效果!

PI;// 3.14

⑤目标方法的this

一旦以指标的不二法门情势调用,比如xiaoming.age(),该函数的this针对被调用的指标,也正是xiaoming,这是契合大家预料的。

假若单独调用函数,比如getAge(),此时,该函数的this本着全局对象,也正是window

坑爹啊!

更坑爹的是,倘若如此写:

var fn = xiaoming.age; // 先拿到xiaoming的age函数

fn(); // NaN

也是至极的!要确认保证this本着正确,必须用obj.xxx()的样式调用!

 

稍加时候,喜欢重构的您把措施重构了一晃:

‘use strict’;

varxiaoming = {

name:‘小明’,

birth:1990,

age:function () {“

function getAgeFromBirth() {“

`**var** y = **new** Date().getFullYear();`

`**return** y – **this**.birth;`

}

`**return** getAgeFromBirth();`

}

};

xiaoming.age();// Uncaught TypeError: Cannot read property ‘birth’
of undefined

结果又报错了!原因是this指南针只在age措施的函数内指向xiaoming,在函数内部定义的函数,this又指向undefined了!(在非strict格局下,它再度指向全局对象window!)

修补的章程也不是尚未,大家用1个that变量首先捕获this

‘use strict’;

varxiaoming = {

name:‘小明’,

birth:1990,

age:function () {“

`**var** that = **this**; `//
在格局内部一开首就破获this

function getAgeFromBirth() {“

`**var** y = **new** Date().getFullYear();`

`**return** y – that.birth; `// 用that而不是this

}

`**return** getAgeFromBirth();`

}

};

xiaoming.age();// 25

var that = this;,你就足以放心地在艺术内部定义其余函数,而不是把全数语句都堆到一个办法中。

 

装饰器

利用apply(),大家还可以动态改变函数的一坐一起。

JavaScript的持有目的都是动态的,尽管内置的函数,我们也足以再次指向新的函数。

明天只要我们想计算一下代码一共调用了稍稍次parseInt(),能够把拥有的调用都找出来,然后手动加上count += 1,不过尔尔做太傻了。最佳方案是用大家温馨的函数替换掉默许的parseInt()

varcount =0;

varoldParseInt = parseInt;// 保存原函数

window.parseInt =function () {“

count +=1;

`**return** oldParseInt.apply(null, arguments); `//
调用原函数

};

// 测试:

parseInt(’10’);

parseInt(’20’);

parseInt(’30’);

count;// 3

 

⑥高阶函数(参数里有函数的函数比如array.map)

Array.reduce

倘使我们继续立异那个事例,想办法把一个字符串13579先变成Array——[1, 3, 5, 7, 9],再利用reduce()就足以写出叁个把字符串转换为Number的函数。

牵连到的标题是:将字符串变成数字的隐式转换(符号)

‘use strict’;

var arr = [‘1’, ‘2’, ‘3’];

var r;

r = arr.map(parseInt);

[1, NaN, NaN]

是因为map()接收的回调函数能够有二个参数:callback(currentValue, index,
array),经常大家仅要求首先个参数,而忽略了流传的末尾多少个参数。不幸的是,parseInt(string,
radix)没有忽视第①个参数,导致实际执行的函数分别是:

parseInt(‘0’, 0); // 0, 按十进制转换

parseInt(‘1’, 1); // NaN, 没有一进制

parseInt(‘2’, 2); // NaN, 按二进制转换不容许出现2

能够改为r = arr.map(Number);,因为Number(value)函数仅接受三个参数。

 

Filter()

Arrayfilter()也吸收一个函数。和map()不等的是,filter()把传播的函数依次功效于各种成分,然后依照重返值是true还是false支配封存仍旧屏弃该因素。

能够用来数组去重

 

箭头函数对this的影响

this

箭头函数看上去是匿名函数的一种简写,但实质上,箭头函数和匿名函数有个举世闻名的界别:箭头函数内部的this是词法效用域,由上下文分明。

回首前边的例证,由于JavaScript函数对this绑定的错误处理,上边包车型客车例证不只怕获取预期结果:

varobj = {

birth:1990,

getAge:function () {“

`**var** b = **this**.birth; `// 1990

`**var** fn = `function () {“

`**return** **new** Date().getFullYear() – **this**.birth; `//
this指向window或undefined

};

`**return** fn();`

}

};

当今,箭头函数完全修复了this的指向,this连天指向词法成效域,也正是外围调用者obj

varobj = {

birth:1990,

getAge:function () {“

`**var** b = **this**.birth; `// 1990

`**var** fn = () => **new** Date().getFullYear() – **this**.birth; `//
this指向obj对象

`**return** fn();`

}

};

obj.getAge();// 25

一旦接纳箭头函数,以前的这种hack写法:

varthat =this;

就不再需求了。

由于this在箭头函数中早就遵照词法功用域绑定了,所以,用call()或者apply()调用箭头函数时,不能够对this展开绑定,即传入的第三个参数被忽视:

varobj = {

birth:1990,

getAge:function (year) {“

`**var** b = **this**.birth; `// 1990

`**var** fn = (y) => y – **this**.birth; `//
this.birth仍是1990

`**return** fn.call({birth:2000}, year);`

}

};

obj.getAge(2015);// 25

 

Generator

generator(生成器)是ES6规范引入的新的数据类型。一个generator看上去像一个函数,但能够回到数次。

 

正式对象

小结一下,有那般几条规则须求遵从:

1.毫不使用new Number()new Boolean()new String()始建包装对象;

2.用parseInt()parseFloat()来转换任意档次到number

3.用String()来转换任意档次到string,可能直接调用有个别对象的toString()方法;

4.常见不必把自由类型转换为boolean再判断,因为能够平昔写if (myVar) {...}

5.typeof操作符能够判定出numberbooleanstringfunctionundefined

6.判断Array要使用Array.isArray(arr)

7.判断null请使用myVar === null

8.判定有个别全局变量是或不是留存用typeof window.myVar === 'undefined'

9.函数里头判断有些变量是或不是留存用typeof myVar === 'undefined'

10.末段有细致的同室提议,任何对象都有toString()方法吗?nullundefined就不曾!确实如此,那四个奇特值要除外,纵然null还伪装成了object类型。

更密切的同室提议,number指标调用toString()报SyntaxError:

123.toString();//SyntaxError“

遇见那种状态,要尤其处理一下:

123..toString();//`'123', `注意是两个点!

(123).toString();//‘123’“

绝不问何故,那正是JavaScript代码的野趣!

 

JSON

序列化

JSON.stringify(xiaoming, null, ‘  ‘);

若是大家还想要精确控制什么体系化小明,能够给xiaoming概念2个toJSON()的章程,间接重回JSON应该体系化的数目

反系列化

拿到一个JSON格式的字符串,咱们一向用JSON.parse()把它变成多个JavaScript对象

 

 

插一句:CSS 动画实战:创造贰个特出的加载动画

http://svgtrick.com/tricks/7ecdbe287454e03bcbe6d36c3ee584bc

 

8-9

  1. 知识点总括

https://github.com/BearD01001/front-end-QA-to-interview#new%E6%93%8D%E4%BD%9C%E7%AC%A6%E5%85%B7%E4%BD%93%E5%B9%B2%E4%BA%86%E4%BB%80%E4%B9%88%E5%91%A2

  1. New关键字的进度

行使new关键字调用函数(new ClassA(…))的具体步骤:

  1. 创设空对象;
      var obj = {};

2.
设置新目的的constructor属性为构造函数的称谓,设置新目的的__proto__性情指向构造函数的prototype对象;   obj.__proto__ = ClassA.prototype;

  1. 应用新指标调用函数,函数中的this被针对新实例对象:
      ClassA.call(obj);  //{}.构造函数();    

正是obj执行三遍构造函数,把品质什么的经过this.xx =xx;给obj。      

  1. 将初始化达成的新目的地址,保存到等号左侧的变量中

 

并且注意,调用构造函数千万并非遗忘写new。为了不同普通函数和构造函数,依据预约,构造函数首字母应当大写,而平常函数首字母应当小写,那样,一些语法检查工具如jslint将能够帮你检查和测试到漏写的new

 

专注:若构造函数中回到this或重返值是着力项目(number、string、boolean、null、undefined)的值,则赶回新实例对象;若重临值是援引类型的值,则实在重返值为这么些引用类型。

 

关于prototype和__proto__的关系

摘自JS高级:

 

我们创设的每种函数都有3个prototype属性,那个脾气是2个指针,指向贰个对象,而以此指标的用途是带有能够由特定类型的装有实例共享的品质和情势。

Constructor(构造函数)属性包罗的是八个针对prototype所在函数的指针,通过那一个构造函数能够再而三为原型对象添加方法和天性。

        
而当调用构造函数制造二个实例之后,该实例将富含3个指针叫做[prototype],也便是浏览器扶助下的__proto__;

 
例如Array.prototype.slice.call();实际上Array便是1个构造函数啦!所以用的是prototype。

 

3.class继承

咱俩先想起用函数完结Student的方法:

function Student(name) {“

`**this**.name = name;`

}

Student.prototype.hello
=
function () {“

alert(‘Hello, ‘+this.name +‘!’);

}

设若用新的class一言九鼎字来编排Student,能够那样写:

classStudent {

constructor(name) {

`**this**.name = name;`

}

hello() {

alert(‘Hello, ‘+this.name +‘!’);

}

}

说到底,创造多少个Student对象代码和前面章节完全相同:

varxiaoming =newStudent(‘小明’);

xiaoming.hello();

class继承

class概念对象的另3个伟大的益处是接二连三更利于了。想一想我们从Student派生1个PrimaryStudent急需编写制定的代码量。今后,原型继承的中级对象,原型对象的构造函数等等都不必要考虑了,直接通过extends来实现:

classPrimaryStudentextendsStudent {

constructor(name, grade) {

`**super**(name); `// 记得用super调用父类的构造方法!

`**this**.grade = grade;`

}

myGrade() {

alert(‘I am at grade ‘+this.grade);

}

}

注意PrimaryStudent的概念也是class关键字贯彻的,而extends则代表原型链对象来自Student。子类的构造函数恐怕会与父类不太相同,例如,PrimaryStudent需要namegrade三个参数,并且供给经过super(name)来调用父类的构造函数,不然父类的name性格不能够平常开端化。

PrimaryStudent已经自行获得了父类Studenthello主意,大家又在子类中定义了新的myGrade方法。

ES6引入的class和原始的JavaScript原型继承有怎样分化吗?实际上它们从不别的不同,class的效果便是让JavaScript引擎去落实原来必要大家和衷共济编辑的原型链代码。一言以蔽之,用class的裨益就是宏大地简化了原型链代码。

 

练习

 

请利用class再一次定义Cat,并让它从已部分Animal此起彼伏,然后新增三个方式say(),重回字符串'Hello, xxx!'

class Animal {

    constructor(name) {

        this.name = name;

    }

}

class Cat extends Animal{

     constructor(name){

          super(name);

}

 

    say(){

       return `Hello, ${this.name}!`

}

}

var kitty = new Cat(‘Kitty’);

 

4.浏览器对象

window

navigator

screen

location

document

history

location.href是壹天质量,要如此使用:
location.href=’http://www.example.com‘而location.assign(‘http://www.example.com‘)就location.href=’http://www.example.com‘至于location.replace(‘http://www.example.com‘)与前双方的分别是,在replace从此,浏览历史就被清空了(href与assign方法会时有发生历史记录)。

 

5.操作DOM

出于HTML文书档案被浏览器解析后便是一棵DOM树,要改变HTML的构造,就需求经过JavaScript来操作DOM。

 

在操作3个DOM节点前,大家需求通过各类措施先得到这些DOM节点。最常用的法门是document.getElementById()document.getElementsByTagName(),以及CSS选择器document.getElementsByClassName()

 

第两种办法是使用querySelector()querySelectorAll(),须求驾驭selector语法,然后利用原则来赢得节点,特别方便.

 

严格地讲,大家那边的DOM节点是指Element,不过DOM节点实际上是Node,在HTML中,Node包括ElementCommentCDATA_SECTION等许二种,以及根节点Document类型,可是,绝大部分时候我们只关怀Element,也正是实际上决定页面结构的Node,其余项目标Node马虎即可。根节点Document曾经自行绑定为全局变量document

 

6.更新DOM

一种是修改innerHTML属性,
第壹种是修改innerTexttextContent属性,那样能够自行对字符串举行HTML编码,保险不恐怕设置任何HTML标签

 

修改CSS也是平时要求的操作。DOM节点的style质量对应全数的CSS,能够一向获得或安装。因为CSS允许font-size如此那般的称号,但它并非JavaScript有效的属性名,所以必要在JavaScript中改写为驼峰式命名fontSize

//
``获取
<p id=”p-id”>...</p>“

var
p = document.getElementById('p-id');

//
``设置CSS:

p.style.color
= '#ff0000';

p.style.fontSize
= '20px';

p.style.paddingTop
= '2em';

  1. 插入DOM

有多个章程能够插入新的节点。二个是应用appendChild,把四个子节点添加到父节点的结尾八个子节点。

 

假使大家要把子节点插入到钦命的岗位怎么做?能够动用parentElement.insertBefore(newElement, referenceElement);,子节点会插入到referenceElement之前。

 

  1. 删除DOM

要去除一个节点,首先要取得该节点自己以及它的父节点,然后,调用父节点的removeChild把团结删掉:

// 得到待删除节点:

var`**self** = document.getElementById('to-be-removed');`

// 得到父节点:

var`**parent** = **self**.parentElement;`

// 删除:

varremoved =parent.removeChild(self);

removed
===
self;// true

留神到删除后的节点即便不在文书档案树中了,但实质上它还在内部存款和储蓄器中,能够随时再度被添加到其余地点。

 

 

MDN- ChildNode.remove()

ChildNode.remove() 方法把从它所属的DOM树中去除对象。

<div id=”div-01″>Here
is div-01
</div>“

<div id=”div-02″>Here
is div-02
</div>“

<div id=”div-03″>Here
is div-03
</div>

varel=document.getElementById(‘div-01’);“

el.nextElementSibling.remove();“

// id 为 ‘div-02’ 的 div 被删掉了

 

8-10

  1. 操作表单

 

付给表单

 

注意到idmd5-password<input>标记了name="password",而用户输入的idinput-password<input>没有name属性。没有name属性的<input>的数码不会被交付。

 

  1. 操作文件

在HTML表单中,能够上传文件的唯一控件就是<input type=”file”>。

注意:当多少个表单包罗<input
type=”file”>时,表单的enctype必须钦命为multipart/form-data,method必须钦点为post,浏览器才能科学编码并以multipart/form-data格式发送表单的数目。

由于安全着想,浏览器只同意用户点击<input
type=”file”>来抉择当三步跳件,用JavaScript对<input
type=”file”>的value赋值是绝非别的意义的。当用户挑选了上传有个别文件后,JavaScript也无从赢得该公文的诚实路径:

File API

出于JavaScript对用户上传的文本操作尤其简单,尤其是无力回天读取文件内容,使得众多亟需操作文件的网页不得不用Flash那样的第1方插件来兑现。

趁着HTML5的普及,新增的File
API允许JavaScript读取文件内容,获得越来越多的公文音讯。

HTML5的File
API
提供了FileFileReader多少个首要指标,能够博得文件音讯并读取文件。

下边的例证演示了怎样读取用户选拔的图形文件,并在贰个<div>中预览图像

  1. 自家评价

推荐语:本身本科时期是数学专业的,由于对电脑编制程序的友爱,大学生转向总计机系,两年时间的品种耗费经历,使得自身的编程能力有了十分大的增进。技术方面熟悉精通数据结构、操作系统、计算机互联网;并对大旨算法及常用设计方式有较好的牵线。熟谙驾驭Java语言及其高级性子,包含集合、I/O流、反射、二十十六线程并发;并对JVM基本原理有一定的驾驭。熟悉通晓JavaWeb技术,包含JSP、JavaScript、Servlet、Session、Filter、Listener、JDBC等技巧。熟习MVC开发方式以及SSH、MyBatis、SpringMVC等JavaEE主流开发框架;具有JavaWeb和.NET开发经历;并对Lucene、JBPM、WebService、Nginx有必然的摸底。熟知应用SQL
Server、MySql数据库,纯熟数据库事务脾性及数据库连接池;领会MySQL数据库的优化;并对Redis有必然的询问。领悟Linux常见操作命令,Maven项目创设及焦点的分布式开发原理。其它,在本科和大学生时期,战表特出,积极参预校内校外实践活动,并数11遍拿走奖学金,其元帅级奖学金五次,博士学业奖学金三回。语言方面通过CET-4和CET-6,具备阅读英文文献和着力的联络能力。在结束学业来临之际,希望团结能有时机和优异的体面职员和工人一起学习发展,共同创制下二个光辉的时代!

 

  1. VUE的学习

 

注明式渲染

 

Vue.js 的为主是一个同意利用简单的模版语法来申明式的将数据渲染进 DOM:

<div id="app-2">

  <span v-bind:title="message">

    鼠标悬停几秒钟查看此处动态绑定的提示信息!

  </span>

</div>

 

var app2 = new Vue({

  el: ‘#app-2’,

  data: {

    message: ‘页面加载于 ‘ + new Date()

  }

})

鼠标悬停几分钟查看此处动态绑定的提示新闻!

此处大家相遇点新东西。你看到的 v-bind 属性被誉为指令。指令带有前缀 v-,以表示它们是
Vue 提供的异样属性。或者你已经猜到了,它们会在渲染的 DOM
上应用越发的响应式行为。简言之,那里该指令的法力是:“将以此成分节点的 title 属性和
Vue 实例的 message 属性保持一致”。

 

8-11

1.react的extends语法(MDN)

使用 extends

先是个例证是根据名为 Polygon ``类创办3个名为Square``的类。 你能够从实战演示探望这几个事例。

class`Square extends Polygon `{“

`constructor(length) `{“

// 那里把length传参给父类的构造方法“

// 作为父类Polygon的宽和高“

`super(length,
length`);“

// 备注:在衍生类中选择this前必须先调用super()方法“

// 忽视这点将会造成三个引用错误“

`this.name
= `’Square’;“

}“

`get area() `{“

`return this.height
\* this.width`;“

}“

`set area(value) `{“

`this.area
= value`;“

`} `

}

 

Getter/Setter访问器属性

get 语法将一个目的属性绑定到查询该属性时将被调用的3个函数上。

语法E

{get prop() { … } }

{get [expression]() { … } }

 

super 关键字用于调用三个指标的父对象上的函数。

super.prop 和 super[expr] 表明式在 和 目的字面量 任何 方法定义 中都以卓有成效的。

语法

super([arguments]);

// 调用 父对象/父类 的构造函数

super.functionOnParent([arguments]);

// 调用 父对象/父类 上的格局

 

  1. 滚动条样式

http://blog.csdn.net/hanshileiai/article/details/40398177

当设置了-webkit-scrollbar属性的时候,尽管只设置了width,也会使滚动条变透明。

从而唯有要求如下两条就能够有相当漂亮的滚动条

#mobile-body-content::-webkit-scrollbar{width:8px}

#mobile-body-content::-webkit-scrollbar-thumb{background-color:#bdf4eb;-webkit-border-radius:4px;border-radius:4px}

 

4:通过并且设置成分的top和bottom,明确因素的中度。

 

5:如何让 height:100%; 起作用

http://www.webhek.com/post/css-100-percent-height.html

比方想让贰个成分的百分比中度height: 100%;起效果,你必要给这些因素的拥有父成分的高度设定二个有效值。

 

 

6:定宽成分居中方法2

{position:absolute;

left:50%;

width:300px;

margin-left:150px;}

 

7:利用伪成分::before或::after发生阴影

#mobile-body-bg:before {

position: relative;

width: 100%;

  height: 25px;

  background: linear-gradient(rgba(34,195,170,0.1) 0, transparent);}

 

8.CSS动画

transform-origin设置旋转元素的侧重点地方

 

animation: msgBounceIn .4s;

animation-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1)

 

@keyframes msgBounceIn{

from{transform:scale(0)}                    //from相当于0%,to相当于100%

40%{transform:scale(1.03)}

75%{transform:scale(0.98)}

to{transform:scale(1)}

}

 

补充一个:transition 属性 

width:100px;

transition: width 2s;

 

8-13

1.git文件上传

http://www.cnblogs.com/cxk1995/p/5800196.html

当麻芋果件更新服务器

http://blog.csdn.net/u014724048/article/details/54408994

服务器覆盖本地

http://blog.csdn.net/zzclqy/article/details/52743810

  1. 利用原来是

transform: translateY(100%);

transition-duration: .3s;

transition-property: transform;

然后

background-color:rgba(0,0,0,0.5);

border-radius:20px;opacity:1;-webkit-transition:opacity
.3s;transition:opacity .3s

transform:translateY(0)

形成对话框的表现!

  1. 对话框关闭的X用::before和::after

.close-btn {

    position: absolute;

    top: 0;

    right: 0;

    height: 20px;

    padding: 12px 18px;

}

 

.close-btn:before {

    top: 10px;

    -webkit-transform: rotateZ(45deg);

    -ms-transform: rotate(45deg);

    transform: rotateZ(45deg);

}

 

 

.close-btn:after {

    -webkit-transform: rotateZ(-45deg);

    -ms-transform: rotate(-45deg);

    transform: rotateZ(-45deg);

}

 

.close-btn:before, .close-btn:after {

    content: ”;

    display: block;

    width: 16px;

    height: 2px;

    position: relative;

    top: 8px;

    background-color: #ddd;

}

  1. 对话框出来时,底层变暗的作用(类似模态框)

#mobile.has-prompt #prompt-bg{

    position:absolute;

    top:0;

    z-index:50;

    display:block;

    width:100%;

    height:100%;

    background-color:rgba(0,0,0,0.5);

    -webkit-border-radius:20px;

    border-radius:20px;opacity:1;-webkit-transition:opacity
.3s;transition:opacity .3s

}

 

5:左侧对话框浮动的解决方法

.msg-row::before, .msg-row::after {

    content: ” “;

    display: table;

}

 

.msg-row::after {

    clear: both;

}

 

6.为啥 .clear :after 和 :before 的 display 属性要定义为 table?

.cf:after,.cf:before {content: ” “; display: table;} .cf:after {clear:
both;} :before是因为table类型能生成单身的bfc,防止上面距塌陷,
:after负责清除浮动,制止父级高度塌陷;同盟使用,代码少,功用高。

唯有是知道父级中度塌陷的代码经测试只必要

.main::after{

    clear: both;

}

.main::after {

    content: ” “;

    display: table;

}

就能够完毕,原理就是使用伪元素清除浮动

 

8-15

  1. 组件化
  2. 回调完结各样作用
  3. 行使数组+1+1这么形成对话?
  4. 何以react的零部件要super(props)
    1. 调用super的原由:在ES6中,在子类的constructor中必须先调用super才能引用this ``(经测试,不调用``super``会报错);
    2. super(props)的目的:在constructor中得以采纳this.props
    3. 末尾,能够看下React文档,里面有一段

Class components should always call the base constructor with props.

下边作者的例证,constructor的标配正是super(props);会活动传入组件的props;  

constructor(props) {

                   super(props);

                   this.state = {

                            replyarr:[“hehe”]

                   };

         }

唯有当不需求consructor的时候能够简写如下

class Welcome extends React.Component {

  render() {

    return <h1>Hello, {this.props.name}</h1>;

  }

}

5.官方实例

class Clock extends React.Component {

  constructor(props) {

    super(props);

    this.state = {date: new Date()};

  }

 

  componentDidMount() {

    this.timerID = setInterval(

      () => this.tick(),

      1000

    );

  }

 

  componentWillUnmount() {

    clearInterval(this.timerID);

  }

 

  tick() {

    this.setState({

      date: new Date()

    });

  }

 

  render() {

    return (

      <div>

        <h1>Hello, world!</h1>

        <h2>It is
{this.state.date.toLocaleTimeString()}.</h2>

      </div>

    );

  }

}

 

ReactDOM.render(

  <Clock />,

  document.getElementById(‘root’)

);

 

  1. 修改情形

①   this.setState({comment: ‘Hello’});

②   当state更新必要动用在此以前的值时,要选用函数实行更新

Because this.props and this.state may be updated asynchronously, you
should not rely on their values for calculating the next state.

For example, this code may fail to update the counter:

// Wrong“

this.setState({“

`counter: this.state.counter + `this.props.increment,“

});“

To fix it, use a second form of setState() that accepts a function
rather than an object. That function will receive the previous state as
the first argument, and the props at the time the update is applied as
the second argument:

// Correct“

this.setState((prevState,`props) =&gt; `({“

`counter: prevState.counter + `props.increment“

}));

创新state数组写法一:

this.setState((prevState, props) => ({

                  counter: prevState.replyarr.push(“一只羊”)

           }));

写法二:

this.state.replyarr.push(“一只羊”);

           this.setState({

                    replyarr:this.state.replyarr

           });

  1. onClick={this.reply1.bind(this)}

react里面那种写法很多,借使不增加bind(this)那就是说在reply1
里面调用this结果是null?

 

①假如你的点击事件触发的格局里必要引用this。就需求绑定啊。不然你的this是null(记得就算没绑定this应该是全局window。但那里this
就是null,撸完手上的必要去看一下react源码 )所以

1.您要么在创建的时候绑定:

<div className=”save”
onClick={this.handleClick.bind(this)}>Save</div>

2.依然在一始发构造器里声称绑定

constructor(props){

  super(props);

  this.handleClick=this.handleClick.bind(this)

3.还有一种是使用闭包把效益域包起来

<div className=”save”
onClick={()=>this.handleClick}>Save</div>

如若用第2种 会在历次点击时经过bind创造一个新的措施,所以一般用2 3
三种景况,彰显调用bind()只是为着确定保证this值。

作者:空腹熊
链接:https://www.zhihu.com/question/50572127/answer/144757646

*创设绑定函数  bind() 最简单易行的用法是开创八个函数,使这些函数不论怎么调用都有雷同的this值。[JavaScript](http://lib.csdn.net/base/javascript)新手常常犯的三个错误是将一个办法从指标中拿出去,然后再调用,希望方法中的this是原先的目的。(比如在回调中传出那个主意。)假使不做尤其处理的话,一般会丢掉原来的目的。从原本的函数和原来的靶子创制多少个绑定函数,则能极美貌地缓解那几个题材:*

this.x =9;

varmodule = {

x:81,

getX:function() {`return this.x; }`

};

module.getX();// 返回 81“

varretrieveX = module.getX;

retrieveX();// 再次回到 9, 在那种情景下,”this”指向全局成效域“

// 创设3个新函数,将”this”绑定到module对象“

// 新手大概会被全局的x变量和module里的属性x所迷惑“

varboundGetX = retrieveX.bind(module);

boundGetX();// 返回 81

组成那里的例证进行明白,React构造方法中的bind即将handleClick函数与这几个组件Component实行绑定以保障在那些处理函数中动用this时得以每一天指向这一零部件

 

  1. 7.       JQUERY对象转DOM对象

二种转移方式将2个jQuery对象转换到DOM对象:[index]和.get(index);

(1)jQuery对象是一个数据对象,能够透过[index]的艺术,来收获相应的DOM对象。

如:

 

 

var $v =$("#v") ; //jQuery对象

var v=$v[0]; //DOM对象

alert(v.checked) //检测这个checkbox是否被选中

(2)jQuery自己提供,通过.get(index)方法,获得相应的DOM对象

 

  1. 8.       让滚动条保持在最头部

$('#content').scrollTop( $('#content')[0].scrollHeight );

`一从头出错的来由是REACT内容渲染前就设置了可观,渲染后不曾重新安装,因而写在componentDidUpdate函数里面,在state转移后自行调用!“`

componentDidUpdate(prevProps,
prevState) {

var contentSH =
$("#mobile-body-content")[0].scrollHeight;

var contentCH =
$("#mobile-body-content")[0].clientHeight;

var scrollTopValue = contentSH - contentCH;

$("#mobile-body-content").scrollTop(scrollTopValue);

}

9. 与滚动栏适配的进度条

//与滚动栏适配的进程条
(function() {
var $w = $(window);
var $prog2 = $(‘.bottombar’);
var wh = $w.height();
var h = $(‘body’).height();
var sHeight = h – wh;
$w.on(‘scroll’, function() {
window.requestAnimationFrame(function(){
//scrollTop()是滚了有个别,sHeight是足以滚多少
var perc = Math.max(0, Math.min(1, $w.scrollTop() / sHeight));
updateProgress(perc);
});
});

function updateProgress(perc) {
$prog2.css({width: perc * 100 + ‘%’});
}

}());

10.

$(window).height(); //浏览器当前窗口可视区域中度

 $(document).height(); //浏览器当前窗口文书档案的冲天

 $(document.body).height();//浏览器当前窗口文书档案body的莫斯中国科学技术大学学

 $(document.body).outerHeight(true);//浏览器当前窗口文档body的总高度包蕴border padding margin 

$(window).width(); //浏览器当前窗口可视区域上涨幅度

 $(document).width();//浏览器当前窗口文书档案对象宽度 

$(document.body).width();//浏览器当前窗口文书档案body的冲天 

$(document.body).outerWi      
dth(true);//浏览器当前窗口文书档案body的总增长幅度 包

 

11.①Jquery里边的{}?——$().css设置几个性虎时正是如此写

②各样中度和鼠标地方

网页可知区域宽: document.body.clientWidth 
网页可见区域高: document.body.clientHeight 
网页可知区域宽: document.body.offsetWidth (包蕴边线的宽) 
网页可见区域高: document.body.offsetHeight (包含边线的高) 
网页正文全文宽: document.body.scrollWidth 
网页正文全文高: document.body.scrollHeight 
网页被卷去的高: document.body.scrollTop 
网页被卷去的左: document.body.scrollLeft 
网页正文部分上: window.screenTop 
网页正文部分左: window.screenLeft 
显示屏分辨率的高: window.screen.height 
显示屏分辨率的宽: window.screen.width 
荧屏可用工作区中度: window.screen.availHeight 
荧屏可用工作区宽度: window.screen.availWidth 

③    生命周期函数

④    缓慢滑动到对象地点

http://www.daixiaorui.com/read/92.html

Jquery的offset()能够获取成分的地点,从而稳定到成分所在处

⑤    同步和异步的概念

http://blog.csdn.net/u013063153/article/details/52457307

异步代码会被放入三个事件队列,等到全部别的代码执行后才开始展览,而不会阻塞线程。

javascript最基础的异步函数是setTimeout和setInterval。setTimeout会在肯定时间后实施给定的函数。它承受二个回调函数作为第三参数和2个飞秒时间作为第3参数。

12.JS的单线程和异步机制

https://www.zhihu.com/question/19732473

怎样领会阻塞非阻塞与一起异步的界别?

http://www.cnblogs.com/sxz2008/p/6513619.html

JavaScript单线程和异步机制

即使JavaScript是单线程的,然而浏览器内部不是单线程的。你的一对I/O操作、定时器的计时和事件监听(click,
keydown…)等都是由浏览器提供的别的线程来成功的。

设若想利用二十多线程处理局地耗时较长的职分,能够动用HTML5建议的Web Worker。

 

8-16

后天修改样式往github上面架一下

 

8-17

  1. JS中的事件绑定,事件捕获,事件冒泡以及事件委托,兼容IE

http://www.cnblogs.com/zhangmingze/p/4864367.html

  1. background-image
  2. https://sologgfun.github.io/
  3. 作者:Try
    链接:https://www.nowcoder.com/discuss/19662?type=2&order=3&pos=21&page=1
    来源:牛客网

初步都以在牛客看外人的面经,面试经验哪些的,这一次该换我来写了,

实习:

校招:

7.20起来投简历

蚂蚁金服UED

一面:55分钟

1.如何让各类情形下的div居中(相对定位的div,垂直居中,水平居中)

  1. display有何值?表明他俩的功用

None,block,inline-block,table,cell

  1. requirejs实现原理

基本原理是动态生成script标签,比如requirejs,seajs。还有一些是ajax请求js代码,然后eval执行的。其余能够关切一下MT.手提式有线话机博客园,基于localstorage来做到路字符级其他增量更新

  1. requirejs怎么幸免再次加载

7.ES6里头的箭头函数的this对象与别的的有甚差异

8.tcp/udp区别

http://www.cnblogs.com/bizhu/archive/2012/05/12/2497493.html

小结TCP与UDP的区别:
1.基于连接与无连接;
2.对系统资源的供给(TCP较多,UDP少);
3.UDP程序结构较不难;
4.流格局与数码报形式 ;
5.TCP保障数据正确性,UDP大概丢包,TCP保障数据顺序,UDP不保障。

  1. tcp3遍握手进程

TCP二遍握手进度
1 主机A通过向长机B 发送三个包涵同步种类号的申明位的多少段给主机B
,向长机B 请求建立连接,通过那个数据段,
主机A告诉主机B
两件事:作者想要和您通讯;你能够用哪些连串号作为先河数据段来回应作者.
2 主机B
收到主机A的乞请后,用一个富含确认应答(ACK)和一块种类号(SYN)标志位的数据段响应主机A,也告知主机A两件事:
本人早就吸收接纳你的伸手了,你能够传输数据了;你要用哪佧连串号作为开场数据段来回应自小编
3 主机A收到这一个数据段后,再发送多个确认应答,确认已吸收接纳主机B
的数据段:”作者已吸纳回复,作者今天要起头传输实际多少了
这么3回握手就完事了,主机A和主机B 就足以传输数据了.
二次握手的特征
未曾应用层的数码
SYN那个标志位唯有在TCP建产连接时才会被置1
握手达成后SYN标志位被置0

  1. xss与csrf的规律与怎么防备

http://blog.csdn.net/koastal/article/details/52905358

①XSS定义的主语是“脚本”,是一种跨站进行的剧本,也正是JavaScript本子,指的是在网站上注入大家的javascript本子,执行违规操作。 
CSQX56F定义的主语是”请求“,是一种跨站的假冒的请求,指的是跨站伪造用户的乞请,模拟用户的操作。

②XSS攻击发生的准绳是足以执行javascript脚本,一般在站点中总会有发布文章、留言等消息的表单,那种表单一般是写入到数据库中,然后在某些页面举办展现。大家得以在那一个表单中一向编写javascript代码(<script>alert("hack
sucess!");</script>
)进行测试,看是不是足以推行。倘诺在新闻展现页面js代码能够推行,XSS攻击就打响了。

CS奥迪Q5F(克罗丝-site request
forgery跨站请求伪造)是一种正视web浏览器的、被混为一谈过的委托人攻击。CSLacrosseF定义的主语是”请求“,是一种跨站的假冒的请求,指的是跨站伪造用户的央求,模拟用户的操作。

 

GET和POST的使用

在web程序的安插规范上,GET传递参数的操作,不应有改变程序的内部结构,首要用以查询音讯的过滤。对于数据库的更删改操作,一定要利用POST格局传值。

XSS和CSLacrosseF攻击的守卫

防御XSS攻击能够经过以下两上面操作: 
1,对用户表单输入的数据开始展览过滤,对javascript代码举办转义,然后再存入数据库; 
2,在音讯的显得页面,也要开始展览转义,幸免javascript在页面上实施。

 

CSQX56F攻击的防卫能够透过以下两地点操作: 
1,全数供给用户登录之后才能执行的操作属于重点操作,那个操作传递参数应该使用post方式,尤其安全; 

2,为幸免跨站请求伪造,大家在某次请求的时候都要带上三个csrf_token参数,用于标识请求来源是不是合法,csrf_token参数由系统生成,存款和储蓄在SESSION中。

  1. mysql与 MongoDB的区别

关系型数据库:最广大应用最广的一类数据库,建立在关乎模型基础上数据模型大约上正是二维表,二个鼓鼓的的表征是用SQL进行操作,能知足大多数要求。常见的MySQL,Oracle,Microsoft
SQL Server等。

MySQL,开源的关系型数据库,在现代数据库中比较独立,能知足你大多数必要,终究Oracle很贵。一般用起来要运转2个MySQL的劳动,然后用客户端去老是它,比如在Java里照旧用shell连接127.0.0.1:3306。之后就能够愉悦地执行SQL语句增加和删除查改了。

事例:比如学生消息保管种类,服务器123.123.123.123:306上用的MySQL,另3个服务器上的Web应用能够三番五次到它,学生基本新闻一个表,班级消息2个表。学生的班级id字段是外键连接到班级消息表的班级id。

SQLite,二个相当精美的关系型数据库,麻雀虽小五脏俱全。(必要长途连服务器上的数据库依然婴儿用MySQL),连接数据库就好像打开个db文件,比如用shell或许编制程序语言总是到e:\example.db。之后就可以载歌载舞地用SQL语句增加和删除查改了。分外适合嵌入到利用内部,比如android应用。显明,假设你写的次序访问的数据想存成二个地面文件,你协调布署文件格式存多少很麻烦不如用这一个。比如做个片子管理app,内嵌mingpian.db来保存名片。

 

非关系型数据库:由于关系型数据库固然数据结构很谨慎专业,有一大堆约束(比如确保每一种数据主键唯一啊,存在其余表里的数码用外键连接啊等等的),不过在一些时候存在欠缺,比如笔者从今日开班存的多少都比后日的多了俩字段,可能今日始发每条数据里面嵌入了一个列表,这时候关系型数据库就糟糕用了(要么建新表,要么alter旧表,不过改变里面存了N多数据的旧表的组织代价十分大),再比如说数据以充实为主,并且修改一条记下有个别字段时讲求旧的本子无法丢。

为了满足这几个须要,就出现了非关系型数据库,也有人称之为NoSQL数据库,扬弃一部分关系型数据库的“严酷”,而支持各样别的脾气。常见的有HBase、MongoDB、Redis等等。   
MongoDB按分类能够算“基于文书档案的数据库”,里面数据的“长相”参见JSON格式。然则在小编眼里,很多吵吵着用MongoDB的景观MySQL完全能够胜任。

 

腾讯TST微信(第一次,内推)

一面:50分钟

5.gulp与webpack区别

7.说下您了然的响应状态码

10.对nodejs领会多少

 

二面:90分钟 (视频面)

率先是八个编程题 

2.落到实处2个可拖动的div(要考虑到浏览器包容性)

http://www.w3school.com.cn/html5/html\_5\_draganddrop.asp

 

 

二面:40分钟

1.相见过什么浏览器包容性难题

  1. 清除浮动有哪三种情势,分别说说

http://www.cnblogs.com/Lu-Lu/p/6253714.html

最强浮动解决帖!

  1. js继承

http://www.cnblogs.com/humin/p/4556820.html

 

三面:90分钟

1.您学过数据结构没,说说您都打听些什么

2.你学过总结机操作系统没,说说您都询问些什么

3.你学过总括机组成原理没,说说您都明白些什么

4.您学过算法没,说说你都打听些什么

5.说下抉择排序,冒泡排序的落到实处思路

复习技术之瞳

7.让您设计多个前端css框架你如何做

12.浏览器缓存的分别

http://www.techweb.com.cn/network/system/2016-01-05/2252395.shtml

17.js中上下文是什么样

https://segmentfault.com/q/1010000008295253/a-1020000008297388

箭头函数没有本身的 thisargumentssupernew.target,
而是通过上溯词法成效域找到近年来概念的那么些.

var obj = {

foo:() =>`console.log(**this**)`

}

那段代码里箭头函数里头的 this 指向的是概念了箭头函数的要命执行上下文,
分明即 window.

ES6 箭头函数中的
this?你恐怕想多了(翻译)

http://www.cnblogs.com/vajoy/p/4902935.html

  1. 当有人说“变量所处的上下文”时,实际指“词法环境”,或许我们常说的成效域,即行业内部中的Lexical
    Environment。
  2. 当有人说“函数的上下文”时,实际指“函数的执行环境”,即正式中的Execution
    Context。
  3. 当有人说“call、apply和bind会改变函数执行的上下文”时,实际指“函数执行时的this”,即标准中的this
    binding。
  4. 当有人说“你那段代码要组成上下文才能收看具体意思”时,此处的上下文正是大家日常生活中说的上下文。

 

21.平淡无奇在档次中用到过什么样设计方式,说说看

 

 

美团

  1. 一来给了张纸要求写js自定义事件

http://www.jb51.net/article/83911.htm

https://developer.mozilla.org/zh-CN/docs/Web/Guide/Events/Creating\_and\_triggering\_events

  1. h5有个api能一定你精通是哪些吧

Geolocation

5.webpack怎么着配置

7.link和@import有哪些分化

  • link属于html标签,而@import是css提供的。
  • 页面被加载时,link会同时被加载,而@import引用的css会等到页面加载结束后加载。
  • link是html标签,因而没有包容性,而@import唯有IE5以上才能辨别。
  • link方式样式的权重高于@import的。

11.出了道url去参数的题让在纸上写 

总计:标题暂且就先那样多,先把书看完

 

8-18

  1. 写个后台程序,时而跑一下证实登录功用

前台是用servlet写得

8-19

  1. 学弟网站,S流,面试题,第贰份简历
  2. Font Awesome矢量字体图标

3. Var k; alert(k);

  1. 二叉树资料

http://blog.csdn.net/fansongy/article/details/6798278/

  1. 在Linux上,对于多进度,子进度继续了父进度的下列哪些?

父进程和子进度具有独立的地址空间和PID参数。

6.

‘a’=97
‘A’=65

7.

最短寻道时间优先算法

8.

微软操作系统(DOS、WINDOWS等)中磁盘文件存款和储蓄管理的微小单位叫做“簇”
扇区:硬盘不是一遍读写一个字节而是贰次读写一个扇区(511个字节)
:系统读读写文件的大旨单位,一般为2的n次方个扇区(由文件系统决定)

块能够分包若干页,页能够涵盖若干簇,簇能够涵盖若干扇区

9.

总计机的微小存款和储蓄单位是字节Byte,二个字节,
是由五个人二进制位组成的,正是这五个人数字只是由“0”和“1”四个数字组合,例如:1111一千,00000001,00000101等,三个英文字母、英文标点、半角数字
在微型计算机是以八个人二进制数保存 就是3个字节大小,贰个汉字(包涵中文标点
全角数字)便是2个字节 (十几人二进制)

一人二进制大小即是1bit

10.

DNS知识点

A:DNS正是将域名翻译成IP地址。

B:主要用UDP,不过当请求字节过长当先512字节时用TCP协议,将其分割成多少个部分传输。

C:DNS协议私下认可端口号是53。

D:操作系统的DNS缓存:windows DNS缓存的暗许值是
马克斯CacheTTL,它的私下认可值是86400s,也正是一天。macOS
严刻遵照DNS协议中的TTL。

   
 游览器的DNS缓存:chrome对种种域名会默许缓存60s;IE将DNS缓存30min;Firefox暗中同意缓存时间唯有1分钟;Safari约为10S。

11.

看二分法完毕细节,取中值时:mid=low+((high-low)/2);是取左中值

12.

线性结构是3个平稳数据成分的汇聚。[1] 

常用的线性结构有:线性表,栈,队列,双队列,数组,串。

至于广义表,是一种非线性的数据结构。

广泛的非线性结构有:二维数组,多维数组,广义表,树(二叉树等),图。

特征

1.集结中必存在唯一的三个”第①个元素”;

2.会见中必存在唯一的2个”最终的成分”;

3.除说到底成分之外,其余数据成分均有唯一的”后继”;

4.除第③成分之外,别的数据成分均有唯一的”前驱”。

数据结构中线性结构指的是多少成分之间存在着“一对一”的线性关系的数据结构。

如(a0,a1,a2,…..,an),a0为率先个成分,an为末段2个成分,此集聚即为一个线性结构的会晤。

对峙应于线性结构,非线性结构的逻辑特征是贰个结点成分大概对应多少个从来前驱和四个后继。

13.

C语言,设有宏定义:

1

2

#define A 4+5

#define B A*A

则发挥式B*B的值为

4+5*4+5*4+5*4+5=69

14.pure

 https://www.purecss.cn/start.html

<meta name=”viewport”
content=”width=device-width,initial-scale=1″>

http://www.cnblogs.com/2050/p/3877280.html

15.CSS传媒询问

CSS 语法

@media mediatype and|not|only (media feature) {
    CSS-Code;
}

您也可以本着分化的传播媒介使用差别 stylesheets :

<link rel=”stylesheet” media=”mediatype and|not|only (media
feature
)” href=”mystylesheet.css“>

 

@media 媒体类型and (媒体个性){你的体制}

@media screen and (max-width: 300px) {
    body {
        background-color:lightblue;
    }
}

 

8-22

  1. 基于pure的CSS框架
  2. React-native

http://www.jianshu.com/p/b88944250b25

  1. 思路一:仅后台间隔执行的话,不用到前台的话不能显示验证码

思路二:

 

8-23

  1. 前端质量优化

https://segmentfault.com/a/1190000000490328#articleHeader4

  1. JSX

 class是js关键字,那里要用className。对于E选项,在jsx中央直机关接写行内样式时不能够动用引号,而是style={{color:’red’}}的法子

  1. 数组方法

核心需求将数组a=[1,2,3]变成[1,2,3,4],必要变更原数组a。

Array对象常用方法中:

不转移原数组:

1、 concat()

连接多个或七个数组

不转移原数组

再次来到被连接数组的3个副本


2、join()

把数组中存有因素放入2个字符串

不改变原数组

回来字符串


3、 slice()

从已有些数组中回到选定的要素

不转移原数组

回去三个新数组


4、 toString()

把数组转为字符串

不更改原数组

回来数组的字符串方式

更改原数组:

5、 pop()

剔除数组最终三个成分,假使数组为空,则不改动数组,重返undefined

更改原数组

归来被剔除的因素


6、 push()

向数组末尾添加贰个或几个因素

改变原数组

回来新数组的长度


7、 reverse()

颠尾数组瓜月素的一一

改变原数组

回来该数组


8、 shift()

把数组的率先个要素删除,若空数组,不开始展览任何操作,重回undefined

变动原数组

回到第叁个因素的值


9、 sort()

对数组成分进行排序(ascii)

转移原数组

回到该数组


10、 splice()

从数组中加上/删除项目

转移原数组

再次来到被去除的成分


11、 unshift()

向数组的发端添加三个或七个成分

更改原数组

归来新数组的长短

A选项,a.reverse()后重返值即数组a变成[3,2,1],再选用unshift()方法在数组初叶添加二个4,a数组就改为了[4,3,2,1]。注,unshift()重返新数组的尺寸,此处为4。正确。

B选项,push()方法重返新数组的尺寸,是三个number类型,不是数组,所以不能再用“.”操作符继续执行reverse()方法。错误。

C选项,正确。

D选项,splice()语法:arrayObject.splice(index,howmany,item1,…..,itemX)。
参数:
index:必需。整数,规定添加/删除项目标岗位,使用负数可从数组结尾处规确定工作岗位位。
howmany:必需。要去除的连串数目。若是设置为 0,则不会删除项目。
item1, …, itemX:可选。向数组添加的新品类。
返回值:
Array:包罗被删去项指标新数组,假若部分话。

出于a.splice(3,1,4)中的index为3,超过了数组a的下标,所以3后边的1也不会起效果。a.splice(3,1,4)会将4插入到数组a末尾。但splice()再次回到值是被去除项指标新数组,由于a.splice(3,1,4)并没有删除成分,所以回来的新数组为空,对空数组reverse()依然空。(假使D选项改成a.splice(3,1,4);a.reverse()就天经地义了。)错误。

 

  1. HTTP2.0

https://www.zhihu.com/question/34074946

多路复用

多路复用允许同时经过单一的 HTTP/2 总是发起多重的呼吁-响应音讯。

分明 ,在 HTTP/1.1 协议中
「浏览器客户端在同权且间,针对同一域名下的呼吁有一定数额限制。超越限制数量的请求会被卡住」。

可以给请求添加优先级

服务器主动推送 server push

首部压缩:HTTP2的底部会减小,从而减弱流量传输

 

  1. position: sticky 

  CSS属性选用用于固定成分的代表规则,被设计为对台本动画效果有用。position属性中最有趣的就是sticky了,设置了sticky的要素,在荧屏范围(viewport)时该因素的职责并不面临一定影响(设置是top、left等属性无效),当该因素的地方将要移出偏移范围时,定位又会成为fixed,依据设置的left、top等属性成固定地点的功能

 

我们必要贯彻动态加载三个 JavaScript 财富,可是有几处不知底怎么着处理,必要您的赞助成功这一项工作

var script = document.createElement(“script”);

var head = document.getElementsByTagName(“head”)[0];

 

script.type = “text/javascript”;

script.src = “//i.alicdn.com/resource.js”;

 

// 绑定能源加载成功事件

script. 1 = function( ){

// 判断财富加载状态是或不是为加载成功或加载成功

if( 2 . test (script. 3  )  ) {

script.onreadystatechange = null;

. . . .

}

};

 

// 绑定财富加载战败事件

script. 4 = function( ) {

. . . .

};

head.insertBefore (script , head.firstChild)

 

(1) onreadystatechange
(2) /^(loaded|complete)$/
(3) readyState
(4) onerror

 

6.

http://www.cnblogs.com/dailc/archive/2016/10/04/5930238.html

  • Native App

即传统的原生APP开发格局,Android基于Java语言,底层调用谷歌的
API;iOS基于OC或然Swift语言,底层调用App官方提供的API。体验最终。

  • Web App

即活动端的网站,将页面安排在服务器上,然后用户选择各大浏览器访问。一般泛指
SPA(Single Page Application)情势开发出的网站。体验最差。

  • Hybrid App

即混合开发,由Native通过JSBridge等方式提供联合的API,然后用Html5+JS来写实际的逻辑,调用API,那种情势下,由于Android,iOS的API一般有一致性,而且最后的页面也是在webview中展现,全体有跨平台功能

  • React Native App

照片墙(Instagram)发起的开源的一套新的APP开发方案,使用JS+部分原生语法来落成效益。初次学习费用较高,不过在入门后,经过完美的卷入也能够完成多数的跨平台。而且体验很好。

对比Hybird和React Native

hybird的产出然则是为了表现,说实话假设没有css,或者hybird那种事物就不会现出。假如您打算做一个谍报客户端,hybird相对是不二的精选。而互相永远是hybird的痛,且不说android局地滚动和ios的各类fixed与input的基情,就终于各样显示器分辨率的处理方案都得恶心的想吐了。

而rn那种东西,其实您把语言换到java
oc一样能够达成,只然则模块化弱类型动的js写那种东西更舒服而已。由于是依据native完成,rn能够幸免掉大家地点说的保不正常,可是hybird带来的优势也会大降价扣:
write once,use anywhere降级成了learn once,write
anywhere,当然了政工逻辑还能复用的。同样的强硬的css被阉割掉了重重性情和全部的层次采取器,展现力没有那么强了,但到底依旧强的。
链接:https://www.zhihu.com/question/38123798/answer/75028325

7.

IndexdDB 是 HTML5 的本土存款和储蓄,把一部分数码存款和储蓄到浏览器(客户端)中,当与互连网断开时,能够从浏览器中读取数据,用来做一些离线应用。

库克ie 通过在客户端 ( 浏览器 ) 记录音信分明用户身份,最大为 4 kb 。

url 参数用的是 get 方法,从服务器上获取数据,大小不可能压倒 2 kb 。

Session 是劳动器端使用的一种记录客户端状态的机制 。

post 是向服务器传送数据,数据量较大。

local Storage 也是 HTML5 的本地存款和储蓄,将数据保存在客户端中。

8.

原型链找不到时,再次来到的是undefined而不是null;

  1. 输出对象中值大于2的key的数组

var data = {a: 1, b: 2, c: 3, d: 4};

Object.keys(data).filter(function(x) { return 1 ;})

期待输出:[“c”,”d”]

参考答案 
(1) data[x]>2

 

Object.keys(Object)

Array.filter(function)

Object是带有属性和办法的靶子, 能够是成立的对象或现有文书档案对象模型 (DOM)
对象。

Object.keys(object)的重临值是 一个数组,当中蕴藏对象的可枚举属性和办法的名目。

Array.filter(function)对数组进行过滤重回符合条件的数组。

Object.keys(data)的再次来到值为数组[“a”,”b”,”c”,”d”],经过 filter(function(x)
{
return ; })过滤,再次回到值大于2的key的数组。x为回去数组的质量名称即“a”、”b”、”c”、“d”,则对应的属性值为data[x],比较语句为data[x]>2。

 

10.

.sub{

    width: 100px;

    float: left;

}

.extra{

    width: 200px;

    float: right;

}

.main{

    margin-left: 100px;

    margin-right: 200px;

}

 

.sub, .extra {

    position: absolute;

    top: 0;

    width: 200px;

}

.sub {

    left: 0;

}

.extra {

    right: 0;

}

.main {

    margin: 0 200px;

}

 

.layout {

    display: flex;

}

.main {

    flex: 1;

}

.aside {

    width: 200px;

}

 

11.没多少的时候的饼图

12.IPV6和IPV4的区别

http://blog.csdn.net/zjuxsl/article/details/44757791

  1. 前者里神奇的BFC
    原理分析

http://www.cnblogs.com/lhb25/p/inside-block-formatting-ontext.html

14.
ES6块级功能域及新变量申明(let)

http://www.cnblogs.com/snandy/p/4485832.html

15.ES6模块的贯彻

http://www.cnblogs.com/vs1435/p/6553134.html

16.演说现代前端组件化框架一些根本性子实现的原理

组件化学工业机械制

数量绑定机制

上下级组件之间数据传递的建制

17.函数柯里化

 

 

8-24

1.箭头函数能不可能作为构造函数

2.react写一个倒计时(聚划算那种)

(本身和服务器时间的同步难题?)

3.成分相对于浏览器左上角的离开

rectObject = object.getBoundingClientRect();

重临值是四个 DOMRect 对象,那些目的是由该因素的 getClientRects() 方法再次来到的一组矩形的聚合,
即:是与该因素相关的CSS 边框集合 。

DOMRect ``对象包含了一组用于描述边框的只读属性``——left``、``top``、``right``和``bottom``,单位为像素。除了`` width ``和`` height ``外的属性都是相对于视口的左上角位置而言的。

 

——————————————————————————————————————

1.你是一个哪些的人?请您选拔多少个词描述本人。为了描述更生动,每一个描述词后请举例表达。(限300字)

和睦相处:从小到大每一个集中华全国体育总会有因为各个原因显得很弱势的人,笔者都会在看不下去的时候拉一把。
精力:就算大学生完成学业已经2四岁了,可是本人大概因为家里有个表妹,所以我的心情更年轻,蒙受挫折也不易于碰到打击。
腾飞:即使不是总括机系,不过笔者对总括机的喜爱促使本身制伏了各种困顿结业的还要控制了多地点的技术。

2.前景,您希望团结成为3个哪些的人?为此您付出了什么样努力?(限300字)

前途自身盼望从事电脑方面包车型客车做事,在技巧方面多加练习,成为3个领域的大牛。
自家本科和硕士尽管均不是总括机系,由于对电脑编制程序的深爱,从大学生入学起,两年时光的种类支付经历,使得自个儿的编制程序能力有了极大的滋长。有记录和享受的习惯,
有协调长时间更新的技艺博客。
技术方面对总计机互联网,基本算法及数据结构有较好的支配。纯熟明白JavaScript语言,包罗ES6有的风味,原生JS
基础扎实。熟识通晓HTML5,CSS技术,包罗但不防止跨域,Session,flex布局等技术。
纯熟Web
框架Backbone,React,JS框架Jquery,underScore,Css框架Bootstrap等主流框架,并且对vue也颇具明白,并且对源码有过学习和研读。
后端上在温馨的门类中运用过PHP和Node.js,使用express框架同盟moongoose使用了MongoDB,通晓并会使用MySql数据库,熟稔数据库的基本处理。
别的,在本科和硕士时期,积极出席校内校外实践活动,并数次得到奖学金,硕士学业奖学金三次。语言方面通过CET-6,具备阅读英文文献和核心的牵连能力。

3.你怎么看待自个儿毕业后的率先份工作?为啥?(限300字)

先是份工作本身觉着能进大商厦就进大商厦,中国邮电通讯正是个中的典型,以中国邮电通讯举例,中国际结盟通的平台是非常大的,作为国家背景的营业商旗下的分店物联网集团也是平等。在那其间项目标水准和数目都是很高的,对友好是很好的练习,而且本人本人是San Jose人,不期待四方奔波,最好能在二个祥和的合营社里面一直极力成长就好了。

4.你何以选用应聘中移物联网有限公司?您希望中移物联网有限公司能给你带来怎么样?(限300字)

中国联通作为明天三小运营商里面包车型大巴龙头,中移物联网集团作为他旗下的网络公司,既有国有集团规范的优势,也有网络飞快的特色,选用那样的商号看成第壹份工作室理所应当的。
自身个人希望集团得以给自个儿成长的阳台和稳定性的前行,笔者深信不疑笔者和中移的实力会更抓好。

 

 

 

8-25

  1. 认清check是或不是选中?如若选中check成分?
  2. HTTPS加密原理

http://www.cnblogs.com/Yfling/p/6670495.html

  1. 前者安全学路虎极光SA非对称加密,DES对称加密
  2. 可以问问给面试官的 前端DES那种对称加密有啥样用?前端加密是不是有意义?
  3. ParyTheLord 16:13:49

ParyTheLord 16:13:49

邱总,额小编想问一下,,小编要写那么些定时调度的话,写在卓殊项指标哪个地方阿?,,

邱添 16:14:55

你会spring框架么

邱添 16:15:09

您能够写八个根据spring框架的调度

邱添 16:15:21

类型里面内置了spring框架

邱添 16:15:43

依旧你能够写一个java程序,然后再linux做调度任务邱总,额笔者想问一下,,俺要写这多少个定时调度的话,写在相当项目的何地阿?,,

  1. 模拟HTTP请求http://blog.csdn.net/pathuang68/article/details/6920076

 

8-28

 

 

8-29

率先,并不是说您一打开多个页面就会发出贰个session。
所谓session你能够那样敞亮:当您与服务端举行对话时,比如说登陆成功后,服务端会为您开壁一块内部存款和储蓄器区间,用以存放你这一次会话的片段内容,比如说用户名之类的。那么就须求1个事物来表明这么些内部存款和储蓄器区间是你的而不是旁人的,这几个东西正是session id(jsessionid只是tomcat中对session id的叫法,在别的容器里面,不肯定正是叫jsessionid了。),而这一个内部存款和储蓄器区间你能够驾驭为session。
接下来,服务器会将这么些session id发回给你的浏览器,放入你的浏览器的cookies中(那几个cookies是内部存款和储蓄器cookies,跟一般的不等同,它会趁着浏览器的关门而化为乌有)。
事后,只有你浏览器没有关闭,你每向服务器发请求,服务器就会从你发送过来的cookies中拿出这一个session id,然后依据那一个session id到对应的内部存款和储蓄器中取你在此之前存放的数额。
但是,如果您退出登陆了,服务器会清掉属于你的内部存款和储蓄器区域,所以您再登的话,会产生多少个新的session了。
不佳意思,小编可能说得不太通晓,但那上面的学问网上有广大,你能够精晓下session的规律。

 

8-30

  1. JS异步(通俗)http://www.cnblogs.com/penghuwan/p/7451409.html
  2. 从未有过IE就不曾侵凌!浏览器包容性问题解决方案汇总

http://www.cnblogs.com/huang361964533/p/7451956.html

 

 

 

8-31
1.

3.BFC

4.事件节流

5.回调XX(没听懂)

6.落到实处3个浏览器内部标签页间的广播发表用如何方式

7.废物回收

8.状态码304

9.文书档案逾期时间怎么设置

10.ES6语法

11.怎么设置2个在PC端与手提式有线电话机端都能够浏览的页面

12.怎么落到实处自适应布局,媒体询问

13.JS模块化,AMD,CMD。。。

14.代码公司格局

15.怎么学习前端

16.跨域JSONP前后端有何样约定啊

身为非科班出身,感觉任重先生道远,努力加油吧,很多看过没用过,面试问的很详细,很多恢弘,感觉相比偏重“你用过吗?”,那如同是面试中冒出频率最高的词了,当然还有“没事”。

诸君加油啊!!

  1. promise,asyn await,还说了三个es6的1个异步处理重要字,
    defer关键字,闭包,局部变量升高成效域,页面渲染,页面加载进度,图片懒加载,还有,但现行反革命不记得了,让自个儿慢慢研究,作者再加上来

 

 

9-4

美图

编程题

1.$.extend

2.DOM操作

3.正则

4.去重和合并

简答

  1. 跨域
  2. 品质优化
  3. ES6

 

9-6

  1. 羡辙的CV
  2. 出入栈和LINUX难题 技术之瞳里面有

 

9-7

  1. 投简历,改随想,笔,网站,技术之瞳
  2. 民用评价:聪明,乐观,皮实,自省(技术之瞳P8)
  3. 面试:相比较大的题目得以友善查到,特性化的难题:推荐适合小编的书,论坛等,JS安全性
  4. 微型计算机互联网

面试常考:https://www.nowcoder.com/discuss/1937

①   网络协议三要素:语义,语法,调换规则

②   在公钥密码体制中,不公开的是  (私钥) 。

③   表示层的要害职能是–关切所传递的音讯的布局,语法和语义

④   从运输层的角度看,通讯的真正端点是–进度。

⑤   关于IP地址

https://www.nowcoder.com/test/question/done?tid=10715152&qid=3488#summary

  1.  flex布局中align-items
    和align-content的区别

6.
求各位数字和:利用43百分之二十=>43的特性,得到去一人的数字,不断%10拿走每1位。

  1. 对行内元素设置margin-top 和margin-bottom是或不是起功能

不起功用。(必要小心行内成分的交替成分img、input,他们是行内元素,然则能够为其安装宽高,并且margin属性也是对其起效果的,有着相仿于Inline-block的行事)

  1. 对内联成分设置padding-top和padding-bottom是还是不是会增多它的惊人

不会。同上题,要留心行内成分的更迭成分,img设置padding-top/bottom是会起功能的。

9.问:要是设置<p>的font-size:
10rem;那么当用户重置或拖拽浏览器窗口时,它的文本会不会遭遇震慑?

答:不会。

rem是css3新增的多少个争持单位(root
em,根em),这么些单位引起了周边境海关切。那个单位与em有怎样分别呢?分裂在于利用rem为要素设定字体大小时,依旧是相对大小,但针锋相对的只是HTML根成分。

 

9-11

SMTP :全称是“Simple Mail Transfer
Protocol”,即简单邮件传输协议。它是一组用于从源地址到指标地址传输邮件的正式,通过它来支配邮件的转向格局。SMTP
协议属于 TCP/IP
协议簇,它补助每台电脑在发送或转向信件时找到下1个指标地。SMTP
服务器便是根据 SMTP 协议的出殡邮件服务器。 

POP3:是Post Office Protocol
3的简称,即邮局协议的第3个本子,它规定怎么将个人计算机连接到Internet的邮件服务器和下载电子邮件的电子协议。它是因特网电子邮件的第三个离线协议正式,POP3允许用户从服务器上把邮件存款和储蓄到当地主机(即本身的微型总计机)上,同时删除保存在邮件服务器上的邮件,而POP3服务器则是比照POP3磋商的接收邮件服务器,用来接受电子邮件的。

博客中介绍,pop3:从服务器下载到本地;SMTP:发送大概转发邮件。

 

  1. java/struts2/spring/ant.maven/devops
  2. 4.      
    总括机互联网动态路由协和式飞机,子网掩码的效用,互联网地址划分,各样地方的意义

 

9-12

1.JS在线编程格式

https://segmentfault.com/a/1190000010715910

2. 《总括机互联网》第六版 复习笔记

http://blog.csdn.net/hcbbt/article/details/18271491

 

9-13

1.烟尘每年来校招的时日都很早,2月首,在宣讲会的头天自己总结看了java基础(准备的太晚),笔试有取舍题(相比较基础)、简答题(较多,涉及java基础,网络TCP/IP,三多线程等)、一道字符串反转编制程序题,两道智力题(如用三个容器分水的问题,很普遍),最终一道主观题,总体来说难点简单,比较基础,只是自小编未曾复习到位,不过照旧被打招呼了一面,也有好多同学被刷了,看来刚初阶好多人都尚未非凡复习,小编归功于大运。一面有八个面试官,都很好,看本人简历上写的是相当熟知C++和java,就问作者java和C++的界别,还有便是问项目,但自笔者做的java的体系相比较久了,笔者也尚无能够准备,综上可得面包车型大巴不得了,就如此如故被打招呼了二面,说是人事面,七个HKuga面三人,大概正是何许联系处事,HENVISION前面有一张纸,作者看来了友好的成绩,笔试和一面的成绩,都相比低,后来H本田CR-V跟作者说一面的面试官觉得小编Java基础一般,提出作者转测试,让我们测试的面试通告。但是后来也从不公告了,作者的小运到此用完了。不要相信运气,主要靠实力。笔试成绩很主要,不问可见要早做准备,要不然只好眼睁睁望着机会从日前没有。一开始本人并不是很想进烽火,没有认真对照,但新兴察觉以协调的实力烽火已经不易了,前边的不在少数小卖部还不如烽火,后悔自个儿从未雅观准备,希望大家吸取作者的教训。 收起

面试官的难题:

问java和C++的区别?

答笔者先是反应是java没有指针,当然那不是答案,面试宝典都有,不细说了

问java的支付经历?

答作者回忆不明了了,没怎么说,自身要精粹准备项目。

问写一段代码完成持续和多态

答只写了继承

问项目中有没有用到数据库连接池?

答没有也要说有,那是很常见的题,最近常用的是c3p0连接池,本身百度

问java设计情势依然数据库范式?

 

7.以下的哪种颜色格式援助上百万种颜色,不过不帮忙无损压缩?

A、bmp

B、jpg

C、gif

D、tif

答案:A

http://blog.csdn.net/xq2768637066/article/details/50894608

 

 

9-18

手写filter

    var arr = [1,2,3];

    arr.filter2 = filter2;

         var re = arr.filter2(mid);

         function filter2(mid){

                   var hehe = [];

                   for(var i of this){

                   var rer = mid(i);

                   console.log(rer);

                   if(rer){

                            console.log(i);

                            hehe.push(i);

                   }

         }

         console.log(hehe);

         }

         function mid(z){

                   if(z<2){return true}

                            else{return false}

         }

 

2.内部存款和储蓄器泄漏

http://www.cnblogs.com/libin-1/p/6013490.html

 

3.
彻底弄懂HTTP缓存机制及原理

http://www.cnblogs.com/chenqf/p/6386163.html

 

  1. 5.       跨域

http://www.cnblogs.com/cndotabestdota/p/7150552.html

 

  1. 6.       美团面经
  2. 东西分外杂,每个都是问三个平常,把还是能想起起来的记录分享一下
  3. js基础(闭包,效率域,es6,this,完成filter,内部存款和储蓄器泄漏)
  4. css基础(重绘重排,采取器,伪类,继承,居中,布局)
  5. http基础(贰次握手,代理,缓存机制,method)
  6. 跨域
  7. 内外互相的数据
  8. 达成响应restful api的路由
  9. 相见的特性优化和化解的标题

 

作者:Say37
链接:https://www.nowcoder.com/discuss/37841
来源:牛客网

一上来面试官就让小编介绍下自家做的档次。小编介绍了之后,就平素不然后了(当时自身觉得会深问)。

下一场便是编制程序了。

1.经文的柯里化难点。编写多少个函数,实现add(2)(3)。

2.成效域难点。

var length = 10;

function fn() {

console.log(this.length);

}

var obj = {

length: 5,

method: function(fn) {

fn();

arguments[0]();

}

};

 

obj.method(fn, 1);

问会输出什么?那个自身答应的不好,可是面试官说(⊙v⊙)嗯,也没给笔者纠错。哎╮(╯▽╰)╭

3.第陆个是出口<body>上面包车型地铁八个<a>标签对应的目录。那个也计算过,不过写的时候失常,哎╮(╯▽╰)╭

4.用2到3行写出二维数组变成一维数组的函数。

本身的思绪是用slice接口把数组中的一人数字切出来,然后拼接concat下1人数字。有好的思路,留言哈

下一场编制程序就甘休了。在那之中最主要的是楼主没用过牛客网上的JavaScript(node
0.12.12)编制程序过,所以全程就相当于是在纸上写代码。会了就不会犯那样多低级错误了。(磕墙……)

尔后问了一部分标题。

1.三列布局怎么落到实处啊,都有何措施。

2.flex搭架子领悟呢?

3.以来在看怎样新技巧?

4.看过怎么博客逛过哪些论坛?

5.怎么学习前端的?

6.您觉得温馨还有哪些优点。

 

作者:Lx15
链接:https://www.nowcoder.com/discuss/37900
来源:牛客网

  1. 自笔者介绍

  2. 何以采取前者

  3. 说一下html5 与html4   

  4. html5 都不外乎哪些,作者关系语义化,然后问 em/strong/i 都怎么用的

  5. canvas 与svg 

  6. requestAnimationFrame 

  7. http 协议的格式

  8. base64 的原理

  9.  表单上传图片的呼吁格式是哪些的

  10. get post 区别

  11. 同源策略 

然后没了,,一共24min, 面试官很nice,
第3次打电话笔者在宿舍,第一遍作者在电梯,第3遍才正式初始,希望nice的面试让过呀。。。。

作者:offer真的来了
链接:https://www.nowcoder.com/discuss/37117
来源:牛客网

② 、bootstrap 布局,栅格布局 ,怎么处理分裂装备上的出入

叁 、http 304 状态码是什么样意思?别的状态码?HTTPS

四 、ajax跨域,有何样化解格局,举了多少个实例让贯彻跨域,访问子域算不算跨域等之类

伍 、一七个不难的算法题(记不清了)

⑥ 、求数组中最大数

七 、事件委托,点击 ul 中的li 弹出li内容,动态添加li

⑧ 、原型链继承:    b.prototype =new a() 不对吗? 

玖 、es6 ,异步原因,promise set map等等

10、事件流 

11、cookie

1贰 、数组去重

13、项目

 

9-20

  1. 1.      
    http等地点总计http://www.cnblogs.com/haoyijing/p/5898420.html#html11

目录:

  1. Cookie
    是不是会被掩盖,localStorage是或不是会被覆盖?
  2. 怎么样保持登陆状态?
  3. Ajax原生
  4. Jsonp的法则。怎么去读取1个script里面包车型大巴多少。
  5. 设若页面开端载入的时候把ajax请求再次回到的数目存在localStorage里面,然后每一次调用的时候去localStorage里面取数,是或不是管用。
  6. 304是何等看头?
  7. 强缓存和斟酌缓存的命夹钟季田管理
  8. http请求和响应的新闻结构
  9. http请求头有哪些字段
  10. http响应常见状态码
  11. 简述http 1.1 与 http
    1.0的区别
  12. 请列举二种禁止浏览器缓存的头字段,
    并写出相应的设置值
  13. 和客户端浏览器缓存相关的http头
  14. Cookie跨域请求能或不能够带上
  15. js异步的法门(promise,generator,async)
  16. Get和post的区别
  17. Post2个file的时候file放在哪的?
  18. 二次握手
  19. tcp/ip/http对应哪一层
    七层模型
  20. 浏览器中输入网址后到页面显示的进度
  21. 浏览器是怎么着进展加载, 解析, 渲染的吗?
    重点说一下浏览器渲染页面的进度?
  22. cookie和session的区别
  23. 同步和异步的区分
  24. 浏览器发送cookie时会发送哪多少个部分?
  25. cookie由哪几部分组成?
  26. 请描述一下 cookies,sessionStorage 和 localStorage
    的差别?
  27. 浏览器本地存款和储蓄与劳务器端存款和储蓄之间的区分
  28. sessionStorage和页面js数据对象的界别

  1. js达成跨域

9-22

  1. 1.       css之父写的,前opera COO
    大学生随想:层叠样式表
  2. 2.       React 源码剖析系列 - 不堪设想的 react diff

https://zhuanlan.zhihu.com/p/20346379

3.React源码分析1 —
框架

http://blog.csdn.net/u013510838/article/details/55669742

  1. 3.       单向数据流 flux

她发起使用flux形式来进展零部件间数据传输,那种做法叫unidirectional data flow(单向数据流),单向数据流的补益是与事先angularJS提出的two-way data binding相相比而言,因为单向,所以种种变动都以可预测、可控制的。不像two-way data binding那么,变化一但复杂起来,大家都互相接触变化,到最终二个地点变了,你一直猜不出来她还会造成其余什么地点接着一起变。那一个必要大批量实施展才能能有所感受,假使您初学,那听听就算了,不必死磕。

  1. 4.       Virtual dom

其一东西的益处是压缩DOM操作,减少DOM操作的目标是增强浏览器的渲染品质

  1. 5.       Diff算法

6.数码绑定

7.  组件化开发

 

8.react有如何用?优点和缺点有如何?

喜欢React的人居多,不过喜欢它的因由都不太雷同

正如具体的长处:

可见落实劳务器端的渲染,便于寻找引擎优化。那一点要比Backbone, Angular
1.x和Ember早期强

可见很好的和现有的代码结合。React只是MVC中的View层,对于其余的部分并没有硬性须求。意味着很多商家在选择用Angular全体重构和用React部分重构的时候,选取了React部分重构

因为一切都是component,所以代码特别模块化,重用代码更易于

学起来万分不难,多少个时辰就足以入门

因为强调只从this.props和this.state生成HTML,写起来bug比较少

相比较高大上的长处,正是豪门在大会上会说的独到之处:

因为用了virtual dom,所以质量很好

因为强调只从this.props和this.state生成HTML,所以十分的functional
programming

缺点:

并不是四个整机的框架,基本都急需添加ReactRouter和Flux才能写大型应用

 

9-25

1.
DNS威迫的场景:你输入的网址是http://www.google.com,出来的是百度的页面。

HTTP胁制的境况:你打开的是网易的页面,右下角弹出唐老师的不孕不育广告。

  1. 光阴复杂度

http://www.cnblogs.com/huangbw/p/7398418.html

3. D3.js是一个数据可视化的库,看看他们的DEMO就可以知道,技术基础是SVG。兼容性是IE9+。

  webgl是HTML5中提出的新技术,是一种3D绘图标准,这种绘图技术标准允许把JavaScript和OpenGL ES 2.0结合在一起,关于它的教程可以看看hiwebgl。目前兼容性堪忧

  three.js是以webgl为基础的库,封装了一些3D渲染需求中重要的工具方法与渲染循环。它的教程同样可以在hiwebgl里面找到。

  three.js之于webgl,类似于windows版本的虚幻引擎之于D3D。当然,虚幻引擎的能力范围比three.js大得多。d3.js跟上面两者没有关系。

4.   这两个引擎各有所长的,具体那个好要看目的是什么。

  OpenGL经过多年的洗刷,已经成为绘图引擎的标准,OpenGL的绘图质量毋庸置疑,是最高的,OpenGL的编程相对的也会比较复杂,但是上手很简单,OpenGL用来追求完美的绘图精确度,而且通常有各种辅助库可以用来往其他设备上输出数据,比如打印机。

  DirectX的专为游戏而生,它的绘图精度满足一般游戏的所需,而且DirectX还包含了不少用来在游戏中处理其他数据的辅助库,包括声音数据,输入输出,等等等等。

  所以,想专精追求绘图,OpenGL是首选,如果要编程效率和其他功能DirectX是首选。

5. 羡辙-着色器-卡通渲染 https://zhuanlan.zhihu.com/p/25595069

http://www.cnblogs.com/wanbo/p/6754066.html[图解WebGL&Three.js工作原理](http://www.cnblogs.com/wanbo/p/6754066.html)

Three.js入门指南https://read.douban.com/ebook/7412854/

 

 

9-26. 邮电科研院被黑

9-27. 

1.VPN原理

2.
SSH原理与利用(一):远程登录http://www.ruanyifeng.com/blog/2011/12/ssh\_remote\_login.html

3.cnpm当真好用!!!

gulp环境中 gulp-sass为什么从来安装战败?

https://www.zhihu.com/question/48845226/answer/113193051

  1. Gulp 方法

http://www.cnblogs.com/White-Quality/p/5756106.html

率先,gulp的源码里没有任何一部分是概念pipe的。

https://segmentfault.com/q/1010000003861104?sort=created

gulp的pipe方法是源于nodejs stream API的。
gulp自己是由一多重vinyl模块组织起来的。

http://www.ydcss.com/archives/424

 

  1. 6.       计算机工程与运用

http://muchong.com/html/201303/5591922.html

http://muchong.com/bbs/journal\_cn.php?view=detail&jid=358

相关文章