第十期阿甘Javascript开发思想(入门篇)

演讲人：雨林木风 - 甘晓聪 ( 阿甘 )

[object Object],[object Object],[object Object]

基于数据模型的开发 ,[object Object],[object Object]

例子： ,[object Object],[object Object],[object Object],改变 CSS 路径怎么去知道我们的个性是需要哪些 CSS ，如何取得 CSS 路径

分析行为 ,[object Object],[object Object]

[object Object],[object Object],[object Object],下一步思考：　　到底是怎样的一个数据呢？

描述数据 var DataModel = { Screen: 0, // 屏幕设置： 0 标准版　 1 宽屏版 2Hao123 风格 Style: 0, // 风格设置： 0 蓝 1 绿 2 粉红 Font: 'Black', // 风格设置 LayOut: 0, // 布局设置 0 为左边 1 为右边 BgImg:0 // 背景图片 } 针对功能这些有结构的数据我们就称它为这一个功能的数据模型

[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

[object Object],[object Object]

JS 对象化语法 ,[object Object],[object Object],[object Object],[object Object]

[object Object],[object Object],[object Object],[object Object],[object Object],/*** 定义类 ***/ var TestClass = function (){ var _self = this; // 把本身引用负值到一变量上 var _Field = ”Test Field”; // 私有字段 var privateMethod = function (){ // 私有方法 alert(_self.Property); // 调用属性 } this.Property = ”Test Property”; // 公有属性 this.Method = function (){ // 公有方法 alert(_Field); // 调用私用字段 privateMethod(); // 调用私用方法 } } var test = new TestClass(); test.Property = “ 测试一下” ; test.Method();

[object Object],[object Object],建立一个指向本对象的引用原因： this 直接指向父级对象 window var privateMethod = function (){ // 私有方法 alert( this .Property); }

[object Object],/*** 定义静态类 ***/ var StaticClass = ( function (){ var Return = { Property : ”Test Static Property”, // 公有属性 Method : function (){ // 公有方法 alert(_Field); // 调用私用字段 privateMethod(); // 调用私用方法 } }; // 定义返回的公有对象 var _Field = ”Test Static Field”; // 私有字段 var privateMethod = function (){ // 私有方法 alert( Return .Property); // 调用属性 } return Return ; // 生成公有静态元素 })(); StaticClass.Property = “ 测试一下” ; StaticClass.Method();

[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

[object Object],[object Object],var A = function(p){ this.Show: function(){ alert(p); } } var B = function(){ A.call(this,1); // 继承 A } new B().Show();

设计模式篇 --- 观察者 ,[object Object],文章地址： http://gandev.com/archives/14 ,[object Object],[object Object],[object Object],[object Object],[object Object]

第十期阿甘Javascript开发思想(入门篇)

Recommandé

Recommandé

Contenu connexe

Tendances

Tendances (20)

En vedette

En vedette (8)

Similaire à 第十期阿甘Javascript开发思想(入门篇)

Similaire à 第十期阿甘Javascript开发思想(入门篇) (20)