2016年11月17日星期四
2016年11月15日星期二
2016年11月10日星期四
Google Blog 11/11/2016 (a.m.)
-
- 定义错误处理中间件时必须使用这 4 个参数
-
-
- 有些路由方法名不是合规的 JavaScript 变量名,此时使用括号记法
-
app.all()是一个特殊的路由方法,没有任何 HTTP 方法与其对应 - 如果在路由句柄中一个方法也不调用,来自客户端的请求会一直挂起
- 有助于创建模块化的路由,而且减少了代码冗余和拼写错误
- 可使用
app.route()创建路由路径的链式路由句柄
-
-
- 所有文件的路径都是相对于存放目录的,因此,存放静态文件的目录名不会出现在 URL 中
- 如果你的静态资源存放在多个目录下面,你可以多次调用
express.static中间件 - 会根据目录添加的顺序查找所需
- 如果你希望所有通过
express.static访问的文件都存放在一个“虚拟(virtual)”目录(即目录根本不存在)下面,可以通过为静态资源目录指定一个挂载路径的方式来实现
-
Google Blog 11/10/2016 (p.m.)
-
- 在ES6之前,社区制定了一些模块加载方案,最主要的有CommonJS和AMD两种。前者用于服务器,后者用于浏览器
- ES6模块不是对象,而是通过
export命令显式指定输出的代码,输入时也采用静态命令的形式
-
2016年11月8日星期二
Google Blog 11/09/2016 (a.m.)
-
数据类型 -- JavaScript 标准参考教程(alpha)
-
undefined:表示“未定义”或不存在,即此处目前没有任何值null:表示空缺,即此处应该有一个值,但目前为空
- 通常,我们将数值、字符串、布尔值称为原始类型(primitive type)的值
- 对象称为合成类型(complex type)的值
-
2016年11月7日星期一
Google Blog 11/07/2016 (p.m.)
-
Node直出理论与实践总结 | Web前端 腾讯AlloyTeam Blog | 愿景: 成为地球卓越的Web团队!
- 问题就是请求数多,前后依赖大
- 首屏展示不再需要等待 JS 文件回来,优化减少了这块时间
- 在前后端没有分离时 使用后端渲染出模板的方式是与文中所述的直出方案效果是一致的,前后端分离后淡化了这种思想,Node 的发展让更多的前端开始做后端事情,直出的方式也越来越被重视了
-
-
iframe跨域通信的通用解决方案 | Web前端 腾讯AlloyTeam Blog | 愿景: 成为地球卓越的Web团队!
- 对于现代浏览器来说,原生的postMessage API一定是不二的选择
-
2016年11月5日星期六
Google Blog 11/06/2016 (a.m.)
-
为Bash和VIM配置一个美观奢华的状态提示栏 • cenalulu's Tech Blog
- 为你的
bash,Terminal,iTerm2,VIM配置上powerline的话,那么效果将会是这样的:
-
2016年11月4日星期五
2016年11月2日星期三
Google Blog 11/02/2016 (p.m.)
-
jQuery UI Autocomplete 体验 - 囧月 - 博客园
- 如果没有指定其中一个属性则用另一个属性替代
- 对于从服务器端输出的JSON的key必须用双引号
- 注意默认传递的参数名称为term
-
-
jQuery UI API – 自动完成部件(Autocomplete Widget) | 菜鸟教程
- 指向一个能返回 JSON 数据的 URL 资源
- 通过一个
term字段添加了一个查询字符串,用于服务器端脚本过滤结果 - 例如,如果
source选项设置为"http://example.com",且用户键入了foo,GET 请求则为http://example.com?term=foo。数据本身的格式可以与前面描述的本地数据的格式相同 - 一个
request对象,带有一个term属性 - 提供单个参数:建议给用户的数据。
- 用于在请求期间提供自定义 source 回调来处理错误。
- 当过滤本地数据时,您可以使用内置的
$.ui.autocomplete.escapeRegex函数。 - 如果搜索无结果或者禁用了 Autocomplete,导致菜单未显示,该事件一样会被触发
-
2016年10月31日星期一
Google Blog 11/01/2016 (a.m.)
-
Charles抓包Localhost | Voyager-1
- Charles无法监听本地服务器
- 访问的网页无法被抓到,此时可以通过访问Mac的本地另外一个域名访问,从StackOverflow找到的,terminalname就是在终端中的用户名
-
2016年10月30日星期日
Google Blog 10/31/2016 (a.m.)
-
每天一个linux命令(7):mv命令 - peida - 博客园
- 用来移动文件或者将文件改名
- 当第二个参数类型是文件时,mv命令完成文件重命名
- 在跨文件系统移动文件时,mv先拷贝,再将原有文件删除,而链至该文件的链接也将丢失
- 目标目录在前,源文件在后
- 该选项适用于移动多个源文件到一个目录的情况
- -f 这是个危险的选项,使用的时候一定要保持头脑清晰,一般情况下最好不用加上它
- -force 一般情况不要随便用
- 如果目录dir2不存在,将目录dir1改名为dir2;否则,将dir1移动到dir2中
- 移动当前文件夹下的所有文件到上一级目录
- mv * ../
-
Google Blog 10/30/2016 (p.m.)
-
IE7识别原生[diabled]CSS属性选择器 » 张鑫旭-鑫空间-鑫生活
- <p><strong>radio单选元素[disabled]属性选择器</strong></p> <input type="radio" disabled><span>颜色是红色则支持</span>
-
2016年10月28日星期五
Google Blog 10/29/2016 (a.m.)
-
macos - Mac OS X Lion 下 Git 如何升级? - SegmentFault
- 使用
which git查看 git 发现位于/usr/bin/git目录下- /usr/bin/是系统默认自带的一些套件的存放点
- /usr/local/git
- homebrew是存放在这里
- 建议修改~/.bash_profile,加入以下内容:
export PATH=/usr/local/bin:/usr/local/sbin:${PATH}
-
-
你应该定期更新 Homebrew - David Chen 的编程大杂烩 - SegmentFault
- 要获取最新的包的列表,首先得更新 Homebrew 自己
-
-
- Mac 的最大优势是 GUI 和命令行的完美结合
- Shell是Linux/Unix的一个外壳,你理解成衣服也行
- 它负责外界与Linux内核的交互,接收用户或其他应用程序的命令,然后把这些命令转化成内核能理解的语言,传给内核,内核是真正干活的,干完之后再把结果返回用户或应用程序
- 能够让你快速上手的zsh项目,叫做「oh my zsh」,Github 网址是:https://github.com/robbyrussell/oh-my-zsh
- 相关的文件在~/.oh-my-zsh/plugins目录
- 系统默认加载 git ,你可以在后面追加内容
- 如果需要新增插件,可以这样做
- 熟练使用可以大大减少 git 的命令长度,命令内容可以参考
~/.oh-my-zsh/plugins/git/git.plugin.zsh - autojump:zsh 和 autojump 的组合形成了 zsh 下最强悍的插件
- 智能跳转(基于autojump)j 目录名(支持模糊匹配和自动补全)d (列出当前会话中访问过的目录列表,输入列表前的序号可以直接跳转)..(跳转到父目录)... (跳转到父目录的父目录)直接输入目录名即可跳转 (省略了cd命令)## 修改默认的shell为zshchsh -s /bin/zsh
-
2016年10月27日星期四
Google Blog 10/27/2016 (p.m.)
-
Git diff ^M的消除 - 博客频道 - CSDN.NET
- 如果用git diff的时候看到^M字符,就说明两个文件在换行符上有所差别
- 由于文件多了CR后造成的
- git config --global core.whitespace cr-at-eol
- 可以让git diff的时候忽略换行符的差异
- 更好的方法是每个项目都有一个.gitattributes文件,里面配好了换行符的设置
-
-
JavaScript ES6(ES2015)入门-核心特性概述 – WEB前端开发 - 专注前端开发,关注用户体验
tags: javascript es6
- ECMA-262标准的描述如下:“ ECMAScript 可以为不同种类的宿主环境提供核心的脚本编程能力,因此核心的脚本语言时与任何特定的宿主环境分开进行规定的。
- 为不同种类的宿主环境提供核心脚本编程能力
- 如果你使用
var,请总是在顶部声明你的变量- 最佳实践
- “暂时性死区”是指从代码块开始直到变量被声明的区域。
- 始终使用
class语法,并避免直接操作prototype。 - 避免使用空的构造函数。
- 使用
extends内置继承方式来实现继承。
-
2016年10月23日星期日
2016年10月22日星期六
Google Blog 10/23/2016 (a.m.)
-
Javascript模块化编程(三):require.js的用法 - 阮一峰的网络日志
- 加载的时候,浏览器会停止网页渲染,加载文件越多,网页失去响应的时间就会越长
- 由于js文件之间存在依赖关系,因此必须严格保证加载顺序
- 当依赖关系很复杂的时候,代码的编写和维护都会变得困难
- 解决办法有两个,一个是把它放在网页底部加载,另一个是写成下面这样
- 解决办法二:<script src="js/require.js" async="true" defer></script>
- data-main属性的作用是,指定网页程序的主模块。
- require()函数接受两个参数。第一个参数是一个数组,表示所依赖的模块
- 第二个参数是一个回调函数,当前面指定的模块都加载成功后,它将被调用。加载的模块会以参数形式传入该函数,从而在回调函数内部就可以使用这些模块。
-
-
Javascript模块化编程(二):AMD规范 - 阮一峰的网络日志
- 大家就想要客户端模块。而且最好两者能够兼容,一个模块不用修改,在服务器和浏览器都可以运行
- 但是,由于一个重大的局限,使得CommonJS规范不适用于浏览器环境
- 引入的模块可能加载时间过程导致整个Application都停留在那里,在浏览器的环境中经常遇到这个问题,但是在服务器上一般都不是个问题,因为模块就在本地
- 浏览器端的模块,不能采用"同步加载"(synchronous),只能采用"异步加载"(asynchronous)。这就是AMD规范诞生的背景
- AMD是"Asynchronous Module Definition"的缩写,意思就是"异步模块定义"
- 所有依赖这个模块的语句,都定义在一个回调函数中,等到加载完成之后,这个回调函数才会运行
- AMD比较适合浏览器环境
- 主要有两个Javascript库实现了AMD规范:require.js和curl.js
-
Javascript模块化编程(一):模块的写法 - 阮一峰的网络日志
- "污染"了全局变量,无法保证不与其他模块发生变量名冲突,而且模块成员之间看不出直接关系
- 原始写法:将不同的函数以及变量简单地放在一起原始写法的缺陷
- 会暴露所有模块成员,内部状态可以被外部改写
- 将模块写成一个对象,将所有的模块成员都放在这个对象里面这样的写法缺点是:
- 使用"立即执行函数"(Immediately-Invoked Function Expression,IIFE),可以达到不暴露私有成员的目的
- 这种写法可以保证外部的代码无法取得内部的状态变量,从而避免被外部改写
- 如果一个模块很大,必须分成几个部分,或者一个模块需要继承另一个模块,这时就有必要采用"放大模式"(augmentation)
- 将模块model1当做参数传入一个IIFE中,就可以对这个模块进行扩展,然后返回一个model1模块
- 在浏览器环境中,模块的各个部分通常都是从网上获取的,有时无法知道哪个部分会先加载
- 使用宽方法的原因就是因为模块加载顺序不确定,单纯使用放大模式可能会导致加载了一个空对象其实宽放大模式就是在IIFF函数中设置参数可以是空对象,避免报错
- 模块内部最好不与程序的其他部分直接交互
-
2016年10月21日星期五
Google Blog 10/22/2016 (a.m.)
-
-
let声明的变量只在它所在的代码块有效 - 如果使用
let,声明的变量仅在块级作用域内有效 - 上面代码中,变量
i是let声明的,当前的i只在本轮循环有效,所以每一次循环的i其实都是一个新的变量,所以最后输出的是6- var a = [];for (var i = 0; i < 10; i++) { a[i] = function () { console.log(i); };}a[6](); // 10
-
let不像var那样会发生“变量提升”现象- 我把这章的代码都放到了最新的babel 6.7.7 try it out 里面去转码,并且打开了全部特性,结果发现文中所讲的变量提升和暂时性死区与babel的行为并不相符, 我们需要明确的是现在最终运行的代码还是es5, 没必要死扣规范,建议看的过程中都把文中的es6代码用babel的官方工具去试试,看看最终是怎么转换成es5的,一来可以看看es6到底对es5增强了什么,二来可以避免一些预想不到的错误
- 只要块级作用域内存在
let命令,它所声明的变量就“绑定”(binding)这个区域,不再受外部的影响- 这个问题和变量提升是一样的 我们在ES6/Babel是看不到预想的结果的
- 在代码块内,使用let命令声明变量之前,该变量都是不可用的
-
2016年10月20日星期四
2016年10月19日星期三
Google Blog 10/20/2016 (a.m.)
-
- not drawn past the edge
-
numberOfLinesmust be set in conjunction with this prop.- numberOfLines需要和这个属性搭配
-
-
- inherit
- 继承
- precedence
- 优先的
- cascade
- 层叠
-
2016年10月17日星期一
Google Blog 10/18/2016 (a.m.)
-
RNStudyNotes/React Native布局详细指南.md at master · crazycodeboy/RNStudyNotes
- 在React Native中尺寸是没有单位的,它代表了设备独立像素。
- React Native中默认为
flexDirection:'column' - React Native中默认为
alignItems:'stretch' - React Native中flex只接受一个参数
- flexDirection enum('row', 'column','row-reverse','column-reverse')
- flexWrap enum('wrap', 'nowrap')
- justifyContent enum('flex-start', 'flex-end', 'center', 'space-between', 'space-around')
- alignItems enum('flex-start', 'flex-end', 'center', 'stretch')
-
Google Blog 10/17/2016 (p.m.)
-
- 并发是指任何一个时间点,服务器上建立的长链接数量。这个长接连是可以复用的,也就是说对于同一个终端的用户,多次进行的数据读写或同一时间的多个数据读写,会复用这一个长接连
-
-
-
- 业务逻辑独立于渲染的代码,你可以进行代码复用。
- 目前有 React Native 与 React Web 代码共享的开源解决方案,例如 react-web
- 在 React Native 中,仅有
<Text>组件可以将纯文本作为子节点。- you must wrap all the text nodes inside of a
component
- 内联样式达到的效果:
- 样式组件
- 提倡样式组件的复用而不是样式的复用
- 基于 Web 的图片资源可以被导入,而无需打包图片到应用中
- 因此在多数情况下,你都应该避免使用基于 URI 的方式
- 默认由最顶层的子节点来处理触摸事件
- 触摸事件有三个主要的生命周期阶段:开始、移动和释放
- 这个行为通过
onStartShouldSetResponder和onMoveShouldSetResponder来指定。当其中一个函数返回true,这个视图就尝试申请进入响应状态。 - 当一个视图尝试申请响应状态之后, 它可能被准许也可能被拒绝
- 响应器的协调函数采用冒泡的形式进行调用
- 嵌套最深的组件就会成为响应器
- 如果你需要一个固定不动的头部和尾部,最简单的办法就是在
<ListView>组件之外单独渲染。
-
2016年10月16日星期日
Google Blog 10/16/2016 (p.m.)
-
-
flow是 Facebook 公司出品的一个类型检查库 - 你需要修复本地的
brew安装程序,brew doctor可以帮助你找到问题所在 - 使用 Xcode 打开 ios/ 目录下的 FirstProject.xcodeproj 文件
- 如果包管理器不幸崩溃退出,可切换到工程目录,然后运行
npm start命令来重启它 -
getInitialState可以让我们创建 React 组件的初始状态(state) - React 组件的生命周期
-
-
- 有个常见的问题是在你运行
react-native run-android命令后,Packger可能不会自动运行。此时你可以手动启动它:
-
-
[新手提问前先来这里看看]React Native的常见问题 | 论坛 - React Native中文社区
- 官方推荐用更简单的fetch api来替代传统的ajax.但目前还无法在Chrome中直接观测请求的详情
-
-
Node项目中,Package.json的版本管理 - 橘子一方的N维空间
- 将默认在package.json中添加小尖尖(
^)而不是小波浪(~)作为依赖版本的前缀。 - ~会匹配最新的子版本(中间那个数字)
- ^会匹配最新的主版本(第一个数字)
-
2016年10月15日星期六
Google Blog 10/16/2016 (a.m.)
-
React Native API模块之AsyncStorage(持久化存储)使用详解 | 江清清的技术专栏
- 官方建议我们最好针对AsyncStorage进行一下抽象的封装在进行使用
- 因为使用AsyncStorage是操作全局
-
Google Blog 10/15/2016 (p.m.)
-
RNStudyNotes/React Native 基础知识总结.md at master · crazycodeboy/RNStudyNotes
- 组件用来改变自己状态的属性,通常使用
setState({key:value})来改变属性值触发界面刷新,不能使用this.state.xxx来直接改变。 -
componentWillMount()还可以用constructor来代替 - 组件可以定义初始值,自己不可更改props属性值,只允许从父组件中传递过来
- 组件可以定义,定义后不能改变,从父组件传递给子组件
- 组件用来改变自己状态的属性,通常使用
setState({key:value})来改变属性值触发界面刷新,不能使用this.state.xxx来直接改变。 - React Native建议由顶层的父组件定义state值,并将state值作为子组件的props属性值传递给子组件,这样可以保持单一的数据传递。
- 对于经常改变的数据且需要刷新界面显示,可以使用state。对于不需要改变的属性值可以使用props
- 从
装载,到渲染,再到卸载当做一次生命周期 - 组件开始装载之前调用
- 只会执行一次
- 在组件装载完成后要显示的时候执行动画
- 只会执行一次
- 组件完成装载之后立即调用
- 组件属性更新之前调用
- 不能在这个方法里使用 this.setState()
-
2016年10月14日星期五
Google Blog 10/14/2016 (p.m.)
-
Android平台Widget集成使用wgt/wgtu升级说明 - DCloud问答
- 一般情况下WebApp的资源是放在原生工程的assets/apps目录下,在生成apk安装包后这个目录下的文件是不能修改
- 5+SDK在wgt/wgtu升级后会将资源释放到SD卡下,路径为 SD卡/android/data/[apk包名]/apps/[WebApp的ID]/www
- 资源升级后调用SDK.startWebApp方法时传入的参数需要进行调整
- 判断SD卡/android/data/[apk包名]/apps/[WebApp的ID]/www目录下是否有应用的mainfest.json文件存在的方式判断应用是否升级
- apk在卸载时SD卡/Android/data/[apk包名] 目录下的内容有可能不会被系统删除
- 建议在WebApp启动前写文件保存当前apk的版本号,每次启动时判断保存的版本号与当前apk的版本号是否一致
-
2016年10月13日星期四
Google Blog 10/14/2016 (a.m.)
-
-
default icon (similar to TabBarIOS.Itemicon)None selectedIconNameName of the selected ico
-
-
[翻译] React.createClass 对比 extends React.Component
- 基于 ES6 的小小语法糖,我们还可以通过
extends React.Component来创建组件 - 使用
React.createClass方法来创建组件是以往的传统 - 通过继承
React.Component代替直接调用React.createClass的方式 - React mixins 的特性将不能被使用
- Facebook 建议在 ES6 的类有完整支持时将
React.createClass完全移除
-
-
- 并不是所有的APP都需要使用全部的原生功能,包含支持全部特性的代码会增大应用的体积
- 在这种思想下,我们把许多特性都发布成为互不相关的静态库
- 大部分的库只需要拖进两个文件就可以使用了
- 提供原生依赖的自动链接
- 现在所有的原生依赖都成功地链接到你的iOS/Android项目
-
-
- 具体的实现在
ResponderEventPlugin.js文件中,你可以在源码中读到更多细节和文档 -
- 反馈/高亮 —— 让用户看到他们到底按到了什么东西,以及松开手后会发生什么。
- 取消功能 —— 当用户正在触摸操作时,应该是可以通过把手指移开来终止操作。
- 如果要做一个按钮或者网页链接,那么使用
TouchableHighlight就可以
-
-
- 最直接的方案就是把组件放置到不同的文件夹
- 在组件的文件命名上加以区分
- React Native会检测某个文件是否具有
.ios.或是.android.的扩展名,然后根据当前运行的平台加载正确对应的文件 - Platform.select(),它可以以Platform.OS为key,从传入的对象中返回对应平台的值
- 可以直接用它针对不同平台返回不同的组件
- 只有一小部分代码需要依据平台定制,那么这个模块就可以派上用场
- 检测当前所运行的Android平台的版本
-
-
- iOS和Android都可以使用
- 只能使用苹果开发好的动画和行为
-
- 只支持iOS
-
-
- 使用React Native替代基于WebView的框架来开发App的一个强有力的理由,就是为了使App可以达到每秒60帧(足够流畅),并且能有类似原生App的外观和手感
- iOS设备提供了每秒60的帧率,这就留给了开发者和UI系统大约16.67ms来完成生成一张静态图片(帧)所需要的所有工作。如果在这分派的16.67ms之内没有能够完成这些工作,就会引发‘丢帧’的后果,使界面表现的不够流畅
- 只要卡顿超过100ms,用户就会明显的感觉到
- 控制台打印语句可能会极大地拖累JavaScript线程
- 发布应用前请务必仔细检查,确保全部移除
- JavaScript线程的性能在开发模式下是很糟糕的
- 可以设置
initialListSize为1 - 每帧所显示的行数由
pageSize所决定 - 0.14版本后默认为true
- 在iOS上,你需要确保在行容器上设置了
overflow: hidden - 你必须提供一个
rowHasChanged函数,它通过快速的算出某一行是否需要重绘 - 如果你没有需要移动这个视图的需求,请关闭这一属性
- 当你点击一个图片,要将它放大到全屏的时候,就可以使用这个属性
- transform: [{scale}]
-
-
- Packager就会根据平台而选择不同的文件
- 为不同的屏幕精度提供图片
- equire中的图片名字必须是一个静态字符串
- var icon = this.props.active ? require('./my-icon-active.png') : require('./my-icon-inactive.png');
- 与静态资源不同的是,
你需要手动指定图片的尺寸- 从网络中获取的图片需要指定尺寸
- 挑出最合适的尺寸显得尤为重要
- iOS会为同一张图片在相册中保存多个不同尺寸的副本
- 这一切过程都是自动完成的
- 从已经打包好的应用资源文件中读取图片(使用
require('image!x')语法)则无需指定尺寸 - 把
src属性改为了source属性,而且并不接受字符串,正确的值是一个带有uri属性的对象 - 在React Native中,图片解码则是在另一线程中完成的
- web上这是页面掉帧的一大因素,因为解码是在主线程中完成的
-
Google Blog 10/13/2016 (p.m.)
-
- These transitions can be typical side-to-side animations down a master/detail stack, or vertical modal popups.
- This will export the component, and in turn allow other components to import it later on
-
-
【翻译】这个API很“迷人”——(新的Fetch API) - w3ctech - 中国最大的前端技术社区
- 基于低版本浏览器的兼容实现
- 接收一个URL参数,返回一个promise来处理response
- fetch()函数
- 可以直接传任意复杂的request请求给fetch()
-
-
- By default, iOS will block any request that's not encrypted using SSL
- to add an App Transport Security exception
-
2016年10月12日星期三
Google Blog 10/13/2016 (a.m.)
-
React-Native组件用法详解之ListView - 简书
- 和原生的用法略有不同
- ListView需要指定数据的来源。传入数据必须是数组,或者是字典里面嵌套数组
- 无法像原生一样去显示指定section和row的个数
- 根据你传入的数据自动生成section和row
- 官方希望我们在构造函数中指定ListView的取值策略
- 构造函数可以接受下列四种参数(都是可选)
- 指定我们更新row的策略,一般来说都是prevRowData和nextRowData不相等时更新row
- 大多数情况下我们会用到第二种(字典套数组)和第三种(纯数组)
-
-
如何使用ListView - react native 中文网
- 元素之间结构近似而仅数据不同
- 垂直的滚动列表
- 更适于长列表数据,且元素个数可以增删
-
ListView并不立即渲染所有元素,而是优先渲染屏幕上可见的元素 - 必须的两个属性是
dataSource和renderRow -
dataSource是列表的数据源,而renderRow则逐个解析数据源中的数据,然后返回一个设定好格式的组件来渲染 - 判断某行数据是否变化了
- 常用场景就是从服务器端取回列表数据然后显示
-
-
如何使用ScrollView - react native 中文网
- 通用的可滚动的容器
- 垂直滚动,还能水平滚动
- 不需要是同类型
- 显示数量不多的滚动元素
- 都会被渲染
- 性能更好的
ListView组件
-
-
- 文本被提交后(用户按下软键盘上的提交键)调用
- 可能想要在用户输入的时候进行验证
-
Google Blog 10/12/2016 (p.m.)
-
使用Flexbox布局 - react native 中文网
- flexbox规则来指定某个组件的子元素的布局
- 在不同屏幕尺寸上提供一致的布局结构
-
flexDirection的默认值是column而不是row
-
-
- 表示的是与设备像素密度无关的逻辑像素点
- React Native中的尺寸都是无单位
- 注册应用(registerComponent)后才能正确渲染 // 注意:只把应用作为一个整体注册一次,而不是每个组件/模块都注册
- 在不同尺寸的屏幕上都显示成一样的大小
- 在可利用的空间中动态地扩张或收缩
- 一般而言我们会使用
flex:1来指定某个组件扩张以撑满所有剩余的空间 - 即占据剩余空间的比等于并列组件间
flex值的比 - 如果父容器既没有固定的
width和height,也没有设定flex- 尺寸为0
- 父容器的尺寸为零。其子组件如果使用了
flex,也是无法显示的。
-
-
- 所有的核心组件都接受名为
style的属性 - 按照JS的语法要求使用了驼峰命名法
- 在数组中位置居后的样式对象比居前的优先级更高
- 我们建议使用
StyleSheet.create来集中定义组件的样式。 - 即后声明的属性会覆盖先声明的同名属性
- 后面会覆盖了前面的
-
-
- 两种数据来控制一个组件:
props和state - 生命周期中则不再改变
- props在生命周期内不会改变,需要改变的数据,我们需要用state来存储
- 对于需要改变的数据,我们需要使用
state - 典型的场景是在接收到服务器返回的新数据,或者在用户输入数据之后。你也可以使用一些“状态容器”比如Redux来统一管理数据流
- 但我们不建议新手过早去学习redux)。
-
-
- 大多数组件在创建时就可以使用各种参数来进行定制
- 括号的意思是括号内部为一个js变量或表达式,需要执行后取值
- 自定义的组件也可以使用
props
-
-
编写Hello World - react native 中文网
- 无需担心兼容性问题
- JSX——是一种在JavaScript中嵌入XML结构的语法
- 上面的代码定义了一个名为
HelloWorldApp的新的组件(Component),并且使用了名为AppRegistry的内置模块进行了“注册”操作 - 一个App的最终界面,其实也就是各式各样的组件的组合
- 在
render方法中返回一些用于渲染结构的JSX语句 - 一般在整个应用里
AppRegistry.registerComponent这个方法只会调用一次 -
AppRegistry模块则是用来告知React Native哪一个组件被注册为整个应用的根容器。
-
2016年10月11日星期二
Google Blog 10/12/2016 (a.m.)
-
- 同甘共苦,荣辱与共:团结协作、集体奋斗是华为企业文化之魂。成功是集体努力的结果,失败是集体的责任,不将成绩归于个人,也不把失败视为个人的责任
- 在与外商的“战斗”中,国内企业无论是技术还是资金、服务都处于劣势,因此普遍采用了“运动战术”
-
Google Blog 10/11/2016 (p.m.)
-
彻底理解Javascript 中的 Promise - cometwo - 博客园
- Promise 对象代表一个异步操作,有三种状态:Pending(进行中)、Resolved(已完成,又称 Fulfilled)和 Rejected(已失败)
- )一旦状态改变,就不会再变,任何时候都可以得到这个结果。Promise 对象的状态改变,只有两种可能:从 Pending 变为 Resolved 和从 Pending 变为 Rejected
- ,避免了层层嵌套的回调函数
- Promise 也有一些缺点。首先,无法取消 Promise,一旦新建它就会立即执行,无法中途取消。其次,如果不设置回调函数,Promise 内部抛出的错误,不会反应到外部。第三,当处于 Pending 状态时,无法得知目前进展到哪一个阶段(刚刚开始还是即将完成)。
- Promise 构造函数接受一个函数作为参数,该函数的两个参数分别是 resolve 方法和 reject 方法。
- 如果异步操作成功,则用 resolve 方法将 Promise 对象的状态,从「未完成」变为「成功」(即从 pending 变为 resolved);
- 如果异步操作失败,则用 reject 方法将 Promise 对象的状态,从「未完成」变为「失败」(即从 pending 变为 rejected)。
- 用Promise.all来执行,all接收一个数组参数,里面的值最终都算返回Promise对象。这样,三个异步操作的并行执行的,等到它们都执行完后才会进到then里面
- 要等数组参数里面的所有异步操作都执行完才会进入到then里面
- all方法的效果实际上是「谁跑的慢,以谁为准执行回调」,那么相对的就有另一个方法「谁跑的快,以谁为准执行回调」,这就是race方法
- 只有第一个执行了回调!
-
2016年10月10日星期一
Google Blog 10/11/2016 (a.m.)
-
- ECMAScript数组的每一项可以保存任何类型的数据
- ECMAScript数组的大小是可以动态调整
- 使用
Array构造函数 - 如果传递的是数值,则会按照该数值创建包含给定项数的数组
- 一个包含3项的数组
- 也可以省略
new操作符 - 创建数组的第二种基本方式是使用数组字面量表示法
- 不要这样!这样会创建一个包含2或3项的数组
- 不要这样!这样会创建一个包含5或6项的数组
- 数组的
length属性很有特点——它不是只读的。因此,通过设置这个属性,可以从数组的末尾移除项或向数组中添加新项 - 利用
length属性也可以方便地在数组末尾添加新项 - 当把一个值放在超出当前数组大小的位置上时,数组就会重新计算其长度值,即长度值等于最后一项的索引加1
- 一个全局作用域而言,使用
instanceof操作符就能得到满意的结果- 判断是不是Array
- 它假定只有一个全局执行环境
- ECMAScript 5新增了
Array.isArray()方法。这个方法的目的是最终确定某个值到底是不是数组,而不管它是在哪个全局执行环境中创建的 - 由于
alert()要接收字符串参数,所以它会在后台调用toString()方法,由此会得到与直接调用toString()方法相同的结果 - 不同之处在于,这一次为了取得每一项的值,调用的是每一项的
toLocaleString()方法,而不是toString()方法- toLocalString()
-
join()方法只接收一个参数,即用作分隔符的字符串,然后返回包含所有数组项的字符串
-
Google Blog 10/10/2016 (p.m.)
-
- 使用
new操作符后跟Object构造函数 - 使用对象字面量表示法
- 之后是一个冒号
- 后面是一个逗号
- 在最后一个属性后面添加逗号,会在IE7及更早版本和Opera中导致错误。
- 数值属性名会自动转换为字符串
- 如果留空其花括号,则可以定义只包含默认属性和方法的对象
- 对象字面量也是向函数传递大量可选参数的首选方式
-
-
- 基本类型值在内存中占据固定大小的空间,因此被保存在栈内存中
-
引用类型的值是对象,保存在堆内存中;
-
-
- 执行环境定义了变量或函数有权访问的其他数据,决定了它们各自的行为
- 变量对象(variable object),环境中定义的所有变量和函数都保存在这个对象
- 每个执行环境都有,但是我们写代码的时候不能访问
- 全局执行环境是最外围的一个执行环境
- 在Web浏览器中,全局执行环境被认为是
window对象 - 每个函数都有自己的执行环境。当执行流进入一个函数时,函数的环境就会被推入一个环境栈中
- 对
with语句来说,会将指定的对象添加到作用域链中 - 对
catch语句来说,会创建一个新的变量对象,其中包含的是被抛出的错误对象的声明
-
-
- 不能给基本类型的值添加属性
- 如果从一个变量向另一个变量复制基本类型的值,会在变量对象上创建一个新值,然后把该值复制到为新变量分配的位置上
- 访问变量有按值和按引用两种方式,而参数只能按值传递。
- 但在检测引用类型的值时,这个操作符的用处不大
- 检测基本数据类型时
typeof是非常得力的助手 - ECMA-262规定任何在内部实现
[[Call]]方法的对象都应该在应用typeof操作符时返回"function" - 在IE和Firefox中,对正则表达式应用
typeof会返回"object"。
-
-
- 推荐的做法是要么让函数始终都返回一个值,要么永远都不要返回值
- 严格模式对函数有一些限制:
- ECMAScript函数不介意传递进来多少个参数,也不在乎传进来参数是什么数据类型
- 命名的参数只提供便利,但不是必需的
- 它的值永远与对应命名参数的值保持同步
- 也就是说通过arguments去修改形参是生效并且同步的
- 这并不是说读取这两个值会访问相同的内存空间;它们的内存空间是独立的,但它们的值会同步。
-
arguments对象的长度是由传入的参数个数决定 - ECMAScript函数不能像传统意义上那样实现重载
- 通过检查传入函数中参数的类型和数量并作出不同的反应,可以模仿方法的重载。
-
-
- 最佳实践是始终使用代码块
- 最常用于循环体中的代码至少要被执行一次的情形
- ECMAScript对象的属性没有顺序。因此,通过
for-in循环输出的属性名的顺序是不可预测的 - 建议在使用
for-in循环之前,先检测确认该对象的值不是null或undefined - 使用
label语句可以在代码中添加标签,以便将来使用- 比较少用
-
break和continue语句都可以与label语句联合使用,从而返回代码中特定的位置。 - 如果使用过度,也会给调试带来麻烦。
- 主要是为了简化多次编写同一个对象的工作
- 在
with语句的代码块内部,每个变量首先被认为是一个局部变量,而如果在局部环境中找不到该变量的定义,就会查询location对象中是否有同名的属性。如果发现了同名属性,则以location对象属性的值作为变量的值。 - 严格模式下不允许使用
with语句,否则将视为语法错误 - 大量使用
with语句会导致性能下降,同时也会给调试代码造成困难,因此在开发大型应用程序时,不建议使用with语句 - 假如确实需要混合几种情形,不要忘了在代码中添加注释,说明你是有意省略了
break关键字 -
switch语句中使用任何数据类型 - 每个case的值不一定是常量,可以是变量,甚至是表达式
-
switch语句在比较值时使用的是全等操作符,因此不会发生类型转换
-


