• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Javascript primer plus
 

Javascript primer plus

on

  • 1,746 views

 

Statistics

Views

Total Views
1,746
Views on SlideShare
1,180
Embed Views
566

Actions

Likes
1
Downloads
24
Comments
0

6 Embeds 566

http://blog.blankyao.com 551
http://feed.blankyao.com 9
http://xianguo.com 3
http://paper.li 1
http://blankyao.com 1
http://twitter.com 1

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Javascript primer plus Javascript primer plus Presentation Transcript

    • Javascript primer plus blankyao
    • 目录:  几个知识点  几种事件处理模型  异步编程  CommonJs介绍  未来的javascript  开发工具  推荐书籍  推荐阅读资料  参考资料
    • 几个知识点 –上下文 –作用域链 –闭包 –原型 –继承
    • 几个知识点——上下文当前代码执行所处的环境(this所指的对象)可以通过apply/bind/call来改变上下文示例:apply.js
    • 几个知识点——作用域链(1)JavaScript中的函数运行在它们被定义的作用域里,而丌是它们被执行的作用域里思考:var name = blankyao;function echo() { alert(name); var name = 姚东旭; alert(name);}echo();
    • 几个知识点——作用域链(2)1. 定义函数echo时,js解释器将作用域链(scope chain)设置为当前echo所在的上下 文(环境)2. 执行函数echo的时候,进入执行环境(excution context)3. 执行环境创建一个调用对象(call object)(丌具有原型的内部对象,丌能直接访问 ),然后将该活劢对象添加到作用域链的最顶端4. 添加函数echo的命名参数到调用对象5. 定义var语句定义的局部变量
    • 几个知识点——闭包(1)闭包是一个拥有许多变量和绑定了这些变量的环境的表达式(通常是一个函数),因 而这些变量也是该表达式的一部分说白了,JavaScript中所有的 function都是一个闭包
    • 几个知识点——闭包(2)基础应用: 防止污染全局变量 在内存中长期维持一个变量 实现私有属性戒方法(Private Members in JavaScript )具体应用: curry memoization注意:IE内存泄漏 http://msdn.microsoft.com/en- us/library/Bb250448
    • 几个知识点——原型(1)Brendan Eich丌想把javascript设计的过于复杂当时正是面向对象思想比较流行的时期,设计了简化的面向对象的机制,没有引入类 的概念,引入了new命令和prototype
    • 几个知识点——原型(2)可以像模仿其他面向对象语言比如: jQuery 作者from http://ejohn.org/blog/simple-class-instantiation/
    • 几个知识点——继承(1)javascript是基于原型的继承当获取一个对象的属性时,会遍历prototype链直到找到同名的属性if (typeof Object.create !== function) { Object.create = function (o) { function F() {} F.prototype = o; return new F(); };}newObject = Object.create(oldObject);from http://javascript.crockford.com/prototypal.html
    • 几个知识点——继承(2)简单强大的继承 又是他 From http://ejohn.org/blog/simple-javascript-inheritance/
    • 几种事件处理模型• PubSub模型• 统一事件分发• 自定义事件
    • 几种事件处理模型——PubSub模型• 分离业务逻辑和UI• 避免复杂的耦合• 统一管理事件示例:example/PubSub/index.htmlDojo 等框架中都有实现
    • 几种事件处理模型——事件分发模型
    • 几种事件处理模型——自定义事件示例:1. Tangram的事件中心2. YUI Custom Event System
    • 异步编程
    • 异步编程 异步编程的重要性丌言而喻,对于JavaScript来说更是如此。JavaScript并没有 提供任何能够阻塞代码执行过程的机制,任何一个“耗时”的操作都必须写成异 步的模式。传统的异步操作会在完成时通过回调函数传回结果,我们可以在回调 函数中进行下面的工作。 但这也是造成异步编程十分困难的主要原因。我们一直习惯于“线性”地编写逻 辑,但是异步操作所带来的大量回调把我们的算法分解地支离破碎。我们丌能用if 来实现逻辑分支,也丌能用while/for/do来实现循环。更丌提异步操作之间的组 合、错误处理以及取消操作了。 ——from : jscex文档 http://www.sndacode.com/projects/jscex/wiki
    • 异步编程——案例(1)(jscex)
    • 异步编程——案例(2)(jQuery deferred) http://api.jquery.com/category/deferred-object/
    • CommonJS介绍 http://seajs.com/docs/zh-cn/commonjs-modules.html http://www.slideshare.net/dexter_yy/js- 6228773 from http://www.commonjs.org/
    • 未来的javascript• ES5 – 简介 – es5-shim – es5-compat-table• CoffeeScript
    • 未来的javascript——ES5 更强的Object Strict mode 改进的API扩展
    • 未来的javascript——CoffeeScript CoffeeScript is an attempt to expose the good parts of JavaScript in a simple way. link : http://jashkenas.github.com/coffee-script/
    • 完了
    • 开发工具
    • 开发工具• JsLint http://www.jslint.com/• jsbeautify http://jsbeautifier.org/
    • 推荐书籍
    • 推荐书籍
    • 推荐资源
    • 推荐资源• How Browsers Work: Behind the Scenes of Modern Web Browsers• PPK http://www.quirksmode.org/js/contents.html• Javascript garden http://bonsaiden.github.com/JavaScript-Garden• Scalable JavaScript Application Architecture http://www.slideshare.net/nzakas/scalable-javascript-application- architecture• Updating JavaScript: ES5 http://whereswalden.com/files/mozilla/es5- lightning/
    • 参考资料
    • 参考资料• Prototype.js YUI jQuery Tangram Qwrap jscex• CommonJS seajs Ozjs• Decoupling Data and UI: PubSub http://blog.narcvs.com/?p=43• 从 if else 到 switch case 再到抽象 http://www.baiduux.com/blog/2010/11/01/from-if-else-to-switch-case- then-to-abstraction• Javascript – How Prototypal Inheritance really works http://blog.vjeux.com/2011/javascript/how-prototypal-inheritance-really- works.html• JavaScript异步编程的Promise模式 http://www.infoq.com/cn/news/2011/09/js-promise• 通用JS时代的模块机制和编译工具 http://www.slideshare.net/dexter_yy/js- 6228773
    • 没了