针对开发的前端技能培训之JavaScript篇

1. Java + Script
训 JavaScript
UED

2. JavaScript Java
…
Java

3. …

4. …

5. ,
Java JavaScript
,
Java JavaScript

6. Java + Script
=
Groovy || JRuby || Scala

7. Java + Script
|!=|
JavaScript

8. JavaScript is

9. JavaScript is
JavaScript

12. 1.

13. JavaScript
App
Tbra
YUI
Native JavaScript

14. Native JavaScript
简单

15. YUI

16. Tbra

17. Resource
JavaScript:
https://developer.mozilla.org/en/Core_JavaScript_1.5_Reference
YUI:
http://developer.yahoo.com/yui/2/
Tbra:
http://assets.taobaocdn.com/tbra/1.0/examples/

18. [ ]
JavaScript
YUI
Tbra
Reference Example

19. 2.

21. source
(abc.source.js)

22. source
(abc.source.js)
source
abc.js

23. source
(abc.source.js) {

24. abc.source.js?t=20121212.js
abc.source.css?t=20121212.css

25. Demo
Assets

26. <script src=”abc.js” />
<script src=”abc.js”></script>

27. [ ]
source
source
assets
script

28. 3.

29. {
(function() {
//code here
})();
}

31. var fn = function() {
//code here
};
fn();

32. var fn = function() {
//code here
};
fn();

33. var fn = function() {
//code here
};
fn();

34. (function() {
//code here
}) ();

35. (function() {
var Dom = YAHOO.util.Dom,
Event = YAHOO.util.Event;
//my code
})();

38. <button onclick=”doSomething();” />
<button id=”J_Button” />
YAHOO.util.Event.on(‘J_Button’, ‘click’, function() {
//doSomething
});

39. <button onclick=”doSomething();” />
<button id=”J_Button” />
YAHOO.util.Event.on(‘J_Button’, ‘click’, function() {
//doSomething
});

40. OK,
(function {
var Event = YAHOO.util.Event;
Event.on(‘J_Button’, ‘click’, function() {
//doSomething
});
})();

41. [ ]
YUI
UED

42. 4.

43. JSON

44. {
“name”: “qingyu”
“gender”: “male”,
“age”: 27,
“interest”: [“movie”, “game”]
}

45. JSON

49. JSONP(JSON with padding)

50. Request:
http://crossdomain.com/xxx?callback=callbackFn
Response:
callbackFn({“id”: 17300, “name”: “qingyu”})

51. [ ]
JSON
JSON
JSONP

52. [JS ]
API
JS
JS
JSON

53. Thank you!