微信小程序详解文档格式.docx

1、看到这里, 就会有很多同学觉得, 我靠, 那我的Android白学了, 那我的iOS白学了, 其实是不然的, 接下来我们再来看看微信小程序中的小字小虽然微信小程序能够提供近似原生的体验, 但是大家不用慌X, 微信小程序还远不可能代替原生应用, 有如下两个原因首先, 微信再大再完整, 也只是一个程序, 在微信里面玩这种大型游戏, 想想就觉得难受其次, 微信运行在iOS和Android中, 本身微信就是受限的, 苹果也不可能让微信把自己的命给革了, 所以微信小程序本身也会受到很多限制但是客户端开发者还是有必要了解一些微信小程序的开发, 这样也能做到知己知彼技术栈这个章节简单的介绍一下微信小程序所使

2、用到的一些知识, 并且对这些知识进展一些简单的了解, 大概有如下的几个方面HTMLCSSJSHTMLHTML类似于我们经常用到的 layout, 是一种类似于XML的文档语言, 使用标签来描述一个页面的结构来看一个简单的HTML例子1.2.3.4.5.HelloWorld6.7.8.9.10.ahref=s:/baidu.这是一个超11.12.上述例子中的一些概念html, head, body叫做标签, 标签有标签的名称img是一个图片标签, 通过img的属性src可以设置图片的路径, 通过路径找到图片a标签是标签, 通过href来设置到的目标, 而a标签开闭标签之间的叫做标签内容, a标签

3、的内容是标签显示在页面中的文本这就是一个常见的html结构, 可以复制并且查看, 通过这个例子, 大家根本上就已经能够掌握HTML的语法了, 和我们的layout非常类似, 但是要注意想a标签这样的标签写法, 和我们平常的写法略有不同HTML掌握到这里已经差不多了, 不用太过深究, 这些标签在微信小程序的开发中根本上没用, 微信有一套自己的标签组件, 但是一定要理解这种写法才行CSS刚刚我们已经见过HTML的写法了, 下面来简单的看一下CSS的一些根本特点首先, HTML用来描述页面结构, 这一点很重要, 也就是说, HTML主要的作用是描述页面上有什么元素, 大致的排列, 大致的顺序, 而不

4、关心页面长相那元素（或者我们称之为控件）的长相, 例如什么字体大小, 什么颜色等, 这些长相或者叫表现上的东西, 通过CSS来描述, 包括相对的位置等, 都是CSS来描述为了说明CSS的作用和写法, 我们对刚刚的程序做一个扩展6.style8.img_simple 9. border:1px solid #ccc;10. padding:5px11./style13.14.15.16.imgclass=img_simplesrc=17.18.19.20.细心的同学可能会发现, 多出来了一个style标签, style标签中写的好似还不是XML, 那这个就是我们的CSS, 类似JSON, CSS

5、中通过冒号来表示key-value的分隔, 通过分号来表示不同属性之间的分隔了解了CSS的写法以后, 接下来我们细致的探讨一下CSS的原理如果要给某个标签添加修饰（长相）属性, 需要先找到这个标签CSS主要的组成局部有以下三个o选择器o位置属性o元素属性我们一个一个来解读一下:选择器选择器就是通过某种方式找到一个标签, 例如我们上面的写法, 首先给img标签添加一个class属性img_simple, 然后在CSS中.img_simple选中了这个标签, 就可以给这个标签添加CSS属性了, 这也类似于我们平常所写的findViewById位置属性在Android中我们使用布局和一些位置属性来确

6、定一个元素的位置, 那CSS中如果要确定一个元素位置的话, 通常只使用位置属性即可, 而位置属性就是类似于我们Android中的layout_marginLeftpaddingLeft等元素属性元素属性就是类似于我们Android开发中常用到的textColortextSize等属性微信小程序的开发并不直接使用HTML, 但是根本上却直接使用CSS, 所以CSS还是有必要学习一下的, 受限于篇幅, 在这里不展开继续讨论CSS的一些具体细节了, 但是提供应大家几篇非常优秀的文章, 便于大家更细致的了解CSSCSS入门最好的手册CSS中的Flex布局语法CSS3简介JavaScript这个局部我准

7、备详细的介绍一下, 同时和Java做一个比照变量和数据类型1.var i =10;2.var s =hello;3.var bool =true;4.var arr =1,2,3;5.var arr =newArray（1,2,3）;JS中变量的声明和Java有显著的不同JS中使用var关键字来声明变量, 不能使用具体的变量类型o因为变量没有数据类型, 在运行时可以随时改变变量的数据类型JS中也有数据类型的概念, =后面的是什么类型的数据一般就是什么类型o数值型, 这一点和Java不同, Java中有int和float之分, 但是JS中没有o字符串型, js中没有字符型这个数据类型, 同时js

8、声明字符串的时候可以使用双引号也可以使用单引号o布尔型o数组, 数组有两种声明方式, 它们是完全等价的不同于Java, JS中只有两种作用域, 一种是全局作用域, 一种是函数作用域, 在JS中并不是每个花括号之间都是一个作用域, 这一点需要注意函数1.function funName（arg1, arg2）2./ function body3.return value;4.5.6.funName（10,20）;很显然JS中定义函数的方式和java不同JS中没有private和private等限定符, 无论是变量还是函数都没有JS的函数参数不声明, 将变量名表示出来即可, 因为JS中并没有变量类

9、型的概念, 变量可以是任何类型JS中调用函数的方式和Java一模一样,函数名（参数1, 参数2）, 先牢记这一点, 很重要这种函数的定义方式在JS中叫做函数字面量, 简而言之就是字面上表示一个函数的方式JS中的函数也是一种数据类型, 这一点和Java有巨大的不同, 在JS中函数是一等公民, 可以传递可以赋值, 同时函数还是一个类型, 如下1.var funName =function（arg1, arg2）如上定义了一个匿名函数, 语法和定义一个普通函数有略微的区别匿名函数就是声明了一个函数变量, 而变量的值就是一个函数声明, 但是这个声明不加函数名匿名函数的声明方式和字面量声明函数根本上是等

10、价的, 只有一个细微的差异, 就是这种方式声明的函数, 在声明后面的代码才可以使用此函数, 而字面量没有这个限制这种函数的声明很显著的说明了一个问题, JS中的函数是一种数据类型, 但是Java中的函数不是, Java中的函数只有字面量的定义方式, 并不是一个值其实字面量的方式创建函数, 最终JS引擎处理的过程也是通过将其转为这种方式进展存储下面对函数做一个扩展6.var fun = funName;7.8.fun（10,20）;JS中无论何种方式声明函数, 其都是一个值, 而值是可以赋值给其它变量的函数调用和函数赋值是不同的o函数的调用是通过函数名（）的方式, 记得后面有括号o而函数当做变量

11、使用的时候, 对其进展赋值是直接使用函数名o这一点要牢记对象众所周知的, JS中没有类型的概念（不准确）, 但是这不妨碍JS是一种面向对象的语言, JS中依然有继承和聚合, JS实现面向对象的方式和Java不同, JS是一个面向原型的语言, 这一点属于高级JS技巧的局部, 不需要特别的关注, 但是要知道, JS中无法声明一个类型, JS中的对象更类似于Java中的Map的概念上面我们提过JS中数组的定义方式, 下面来看看如何定义一个JS中的对象1.var obj =2. property1:nihao,3. property2:10,4. property3:true5.7.var obj =newObject（）;8.obj.property1 =9.obj.property2 =10;10.obj.property3 =true;通过这种方式, 你会发现, 这和JSON很像, 同时又像Java中的Map集合对象中是一些键值对, 每一个键值对