校招求职心得与感想

十月金秋,正是收获的季节,同时也是成电大四的莘莘学子求职、深造的关键期,意向工作的我在这个阶段很幸运地拿到了理想中的offer,求职路也尘埃落定。先说下整体情况,作为成电信软2013级数字动漫方向的一名普通学生,没有特别厉害的竞赛成绩或者工作室经历,在大三以前,进大公司也一直是遥不可及的梦想,大三的时间里,通过自学、实习等一系列途径极大地锻炼和提升了自己的工程能力,宛如咸鱼翻身,找到了自己的定位。秋招以来,所投的几家大公司基本都有斩获,目前拿到了阿里巴巴、百度、网易互联网和搜狐的offer,职位都是前端开发工程师,其中网易是通过一段时间的实习通过考核顺利转正。下面分享一下自己求职以来获得的心得和感悟,希望对大家有所帮助。

网易半年实习总结&收获&感想

自一月来网易实习以来,掐指一数已经实习了大半年了。实习内容主要是对内测试平台相关前端开发。这半年时间里,无论是从技能还是心智上,我都成长了很多。总的来说,我所接触的有两个大的项目,下面以项目入手,总结下所学所做、锻炼的能力和遇到的一些问题。

What is Symbol in ES6?

I used to be asked in an interview : Do you know Symbol in ES6? And I answered nope and explained other features such as lamda and ClASS. But it doesn’t help, however, the interviwer doesn’t care at all. :’(
Recent days I’ve tried to learn about Symbol.
MDN define it as below:

A symbol is a unique and immutable data type and may be used as an identifier for object properties. The Symbol object is an implicit object wrapper for the symbol primitive data type.

It makes me confused at first. I screamed inside my heart : What the fxxt is it ?
What is an implicit object wrapper ? The 7th basic type of data in JavaScript? Where should we use it?

And I tried to read some articles, most of that were same and translated into Chinese form English apparently. Bad translating and making people confused. What is 这里也有几个可能的问题。他们都与这样的事实相关,那就是你的代码不是唯一一个使用 DOM 的代码。? What does this sentence mean? I couldn’t read it once more.
I’d better read it from English cause it’ll be easier for me to understand.
I tried to use BABEL to translate symbol to ES5, but it doesn’t help either. It won’t compile this feature.
Finally I chose to try this feature in Chrome Devtool and figured out the usage of SYMBOL.

Practice is the best way to comprehend the

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
var people_I_know = {}
var friend1 = Symbol("friend");
people_I_know[friend1] = {name: "Jude Law", gender: "male"}
var friend2 = Symbol("friend");
people_I_know[friend2] = {name: "Theo James", gender: "male"}
var uncle1 = Symbol("relative");
people_I_know[uncle1] = {name: "Bradley Cooper", gender: "male"}

//Object {Symbol(friend): Object, Symbol(friend): Object, Symbol(relative): Object}
console.log(people_I_know);
//even if I set variable friend1 or friend2 free. It won't influence object at all.
//The only difference is that I cannot access people named 'Jude Law'
//Luckily, ES6 also provides us **Object.getOwnPropertySymbols** to loop through all the symbols of an object
//and another one is **Reflect.ownKeys**. It will return an array in which includes all the property name of object


var friend3 = "friend",
friend4 = "friend";
people_I_know[friend3] = {name: "f3"};
people_I_know[friend4] = {name: "f4"};
//Aparently in this case object will only have a property "friend" and value "{name: 'f4'}"

We introduce Symbol in order to prevent the conflict of same property name. Everytime we call the Symbol, it will return a exclusive value for you. You’ll never need to worry about this issue.

参考链接
ES6学习笔记3—Symbol

关于前端模板引擎和曾经被看好的Object.observe的那些事儿

最近在看一些前端MV框架的实现原理,按照我的理解来看,在模板渲染方式上实现方式有以下几种:
1.基于脏检查的模式,包括熟悉的RegularJS和AngularJS
2.基于defineOwnProperty的getter和setter模式,比如avalon vue1
3.基于Vitual Dom的diff并局部替换真实DOM Tree的模式,大名鼎鼎的React
4.基于*Object.observe(O.o)
直接监听数据的变化(下面讨论的重点)

===
在去年的这个时候,Chrome的V8引擎实现了(O.o),被认为对将来的前端框架的一次革新,它更新页面模板性能上提高了很多倍。
相关文章诸如Object.observe() 引爆数据绑定革命,在RegularJS中,其作者(郑海波大神)甚至还在Regular上留下了待更新的部分。
regular正是在这种百花齐放的时候产生, 最终在实现上采取了angular的数据更新策略(但是提取了表达式的依赖关系以便在Object.observe正式到来时切换到脏检查+observe的形式)提倡极致的声明式和裸数据操作, 依赖于基于字符串的模板描述结构结合更规范性的类式继承的组件体系来定义数据层的业务逻辑.
RegularJS —— 来自网易的JavaScript MVC框架
当我在 CanIuse 去查询它的实现的范围时,发现只有Chrome的特定版本(45)实现,并在其后的版本删除了这个特性。
然而却尴尬地发现这个特性已经被移除草案了。详见:Object.observe是否被移除ES7草案?

JavaScript upgrade will nix object observation feature这篇文章中介绍了其背景。

===

大概的意思是说情况有所变更,导致其不再适用,随着三年过去,基于数据绑定的组件是很难去匹配(O.o)的,这将会导致前端更混乱的场面。

Object.observe, a planned feature for JavaScript that would allow for direct observation of changes to objects, will be removed from a planned update to the ECMAScript specification under a plan floated this week.

The plan, offered by Object.observe proponent Adam Klein on the ECMAScript discussion archives site, says circumstances surrounding the technology have changed, making it unfeasible.

Object-observe has been slated for inclusion in ECMAScript 7, also known as ECMAScript 2016. Klein wants to withdraw Object.observe from the TC39 committee, which has jurisdiction over ECMAScript, the technical specification underlying JavaScript. He also said he’ll remove support for it from Google’s V8 JavaScript engine.

“Over three years ago, Rafael Weinstein, Erik Arvidsson, and I set out to design and implement what we believed to be the primitive underlying the data-binding system of MDV (model-driven views),” Klein said in a blog post. “We prototyped an implementation in a branch of V8, then got agreement from the V8 team to build a real version upstream, while pushing Object.observe (O.o) as a part of the upcoming ES7 standard and working with the Polymer team to build their data-binding system on top of O.o.

“Three years later, the world has changed in a variety of ways,” he said. While data-binding frameworks such as Ember and Angular showed interest, it was difficult to see how they could evolve their existing model to match O.o. “Polymer rewrote from the ground up for its 1.0 release, and in that rebuilding did not utilize O.o. And React’s processing model, which tries to avoid the mutable state inherent in data-binding systems, has become quite popular on the Web.”

Klein recommends developers who have experimented with Object.observe instead consider a polyfill such as MaxArt2501/object-observe or a wrapper library such as polymer/observe-js, for observing changes in JavaScript data.

(待翻译)

2015下半年书单

2015下半年书单

前端类

Head First HTML&CSS (已读)
JavaScript DOM 编程艺术(2E)(已读)
Head First Ajax(已读)
高性能网站建设指南(已读)
精通正则表达式(3E)(已读)
Node.js开发指南(已读)
Head First PHP & MySQL (已读)
锋利的jQuery(2E)(已读)
HTML5与CSS3基础教程(7E)[最新版:8E](已读)
PHP和MySQL程序开发(4E)(已读)

HTTP权威指南(粗略已读)
CSS权威指南(3E)(粗略已读)
HTM5程序设计(2E)(粗略已读)
——————————————————————————————————
JavaScript 高级程序设计(3E)(反复研读) ★★★★★
高性能网站建设进阶指南(在读)
JavaScript语言精粹(在读)
JavaScript设计模式(在读)
——————————————————————————————————
JavaScript权威指南(6E)(已购)★★★★★
深入浅出Node.js(过难)


前端相关框架

  • JQuery (已学)
  • Bootsrap (粗略已学)
  • VUE.js (在学)
  • Angular.js
  • Backbone.js
  • React.js (在学)
  • Require.js
  • Gulp.js
  • Grunt Yoman Bower
  • Webpack

程序类

算法导论(在读)
编程之美 + 编程珠玑 + 算法导论 + 剑指offer【程序员必读经典】
编译原理
计算机科学导论


人文类

已读
围城
欧亨利短篇精选
莫泊桑短篇精选
雪国
白夜行
——————————————————————————————————
在读
自控力