转载请注明出处:王亟亟的大牛之路

昨天写了篇React.js的开头之作,讲了讲块级作用域和let,先安利:https://github.com/ddwhan0123/Useful-Open-Source-Android

上一篇的传送门:http://blog.csdn.net/ddwhan0123/article/details/52681169

这里补充下语法环境皆为 ES6


const

const类似于java中的 常量,申明了值就不允许改变。

申明了 就必须立马赋值 不然会 抛SyntaxError: Missing initializer in const declaration

赋值语句和普通变量没什么区别

 const Wjj = 10086;

const和let一样,也只能在所在的{}范围内有效,超出了也会抛出Uncaught ReferenceError: Wjj is not defined

和let一样 他也必须先申明后使用

const如果申明的是一个非基本数据类型,那么他会指向一个地址,但是这个地址的数据是可变的。

要怎么改变常量的值可以用

const wjj = [];

通过改变数组里元素的值来改变常量的值


箭头函数

第一眼看到给我的感觉像 java8的lambda 表达式,实际上也差不多,让我们来看看具体是怎么回事

他其实也就是 一种function(){}的简写,结构如下

([param] [, param]) => {
   statements
}

param => expression

参数不是必须的,返回值也不是必须的,你可以根据自己的需要做出组合。

//无参数,无返回值
() => { console.log( 'wjj' ) } 

//一个参数可以省略 ()
x => { console.log( x )} ;

// 多参数不能省略 ()
(x, y) => { console.log( x + y ) } ;

//和普通函数一样,箭头函数也可以使用 ES6 的“默认参数”形式
var wjj = (x = 1, y = 2) => x + y;
wjj(); //结果等于 3

//多行语句要用 {} 括起来;单行表达式不需要 {}
x => { return x * x };
x=> x+x;

但是
x=> return x+x;会报错

PropTypes

React.PropTypes 提供很多验证器 (validator) 来验证传入数据的有效性。当向 props 传入无效数据时,JavaScript 控制台会抛出警告。类似于RxJava的.fliter()。

接下来用一个简单的例子来解释下这个属性

<!DOCTYPE html>
<html>
  <head>
    <script src="../build/react.js"></script>
    <script src="../build/react-dom.js"></script>
    <script src="../build/browser.min.js"></script>
  </head>
    <body>
      <div id="example"></div>
      <script type="text/babel">
      var TestPro=React.createClass({

        propTypes: {
          title: React.PropTypes.string.isRequired,
        },

        render: function() {
          return <h1> {this.props.title} </h1>
        }
      });

      ReactDOM.render(
        <TestPro title="hi" />,
        document.getElementById('example')
      );
      </script>
    </body>
  </html>

这里定义了一个TestPro组件,我们设定了他的title属性必须为string类型,我们在调用装载这个组件的时候传入了’hi’,效果如下

如果传入不合法值的时候就会报错了

混合开发的大趋势之 一个Android程序员眼中的 React.js 箭头函数,const, PropTypes的更多相关文章

  1. 混合开发的大趋势之 一个Android程序员眼中的 React.js 块级作用域 和 let

    转载请注明出处:王亟亟的大牛之路 最近都有事干然后,快到月底了这个月给CSDN的博文也就两篇,想想也蛮多天没更了,那就来一篇. 老规矩,先安利:https://github.com/ddwhan012 ...

  2. 混合开发的大趋势之一React Native之简单的登录界面

    转载请注明出处:王亟亟的大牛之路 这些天都在学习RN这部分吧,然后写了个简单的登陆业务,从"实战"中讲解吧 还是继续安利:https://github.com/ddwhan0123 ...

  3. 混合开发的大趋势之一React Native与Android联调

    转载请注明出处:王亟亟的大牛之路 先安利,有空我都会更,看到的好东西都会放进来:https://github.com/ddwhan0123/Useful-Open-Source-Android 公司某 ...

  4. 混合开发的大趋势之一React Native手势行为那些事

    转载请注明出处:王亟亟的大牛之路 最近项目部分模块重构,事情有点多,学习进度有所延缓,外加一直在吸毒(wow你懂的),导致好多天没发问了,其实这部分知识月头就想写了,一直没补. 话不多说先安利:htt ...

  5. 混合开发的大趋势之一React Native之页面跳转(2)+物理返回+特定平台代码

    转载请注明出处:这里写链接内容 今天是10月份的最后一天,我加了3个月来的第一个班,挤出了这篇. 废话不多先安利,然后继续学习 RN 有好东西都往里面丢,努力做好归纳 https://github.c ...

  6. 混合开发的大趋势之一React Native之页面跳转

    转载请注明出处:王亟亟的大牛之路 最近事情有点多,没有长时间地连贯学习,文章也停了一个多礼拜,愧疚,有时间还是继续学习,继续写! 还是先安利:https://github.com/ddwhan0123 ...

  7. 混合开发的大趋势之一React Native之Image (脑动理解)

    文章是宝宝自己写的,你可以转走,标明哪来的就行王亟亟的大牛之路 国庆这些天要么旅游要么WOW,感觉整个人都废了.. 直接从黄种人晒成了非洲大酋长..然而还是无橙,这礼拜要做7天,昨天把单元测试的东西整 ...

  8. 金三银四背后,一个 Android 程序员的面试心得

    回顾一下自己这段时间的经历,九月份的时候,公司通知了裁员,我匆匆忙忙地出去面了几家,但最终都没有拿到offer,我感觉今年的寒冬有点冷.到十二月份,公司开始第二波裁员,我决定主动拿赔偿走人.后续的面试 ...

  9. 一个iOS程序员眼中的跨域问题

    摘要: 跨域问题是web开发领域一个常见的问题,相信每个web开发者都遇到"跨域"的问题 最近公司的iOS开发任务比较少,所以自己最近开始了Web开发的任务,在用H5做了很多页面, ...

随机推荐

  1. AndroidManifest.xml文件详解(activity)(三)四种工作模式

    android:launchMode 这个属性定义了应该如何启动Activity的一个指令.有四种工作模式会跟Intent对象中的Activity标记(FLAG_ACTIVITY_*常量)结合在一起用 ...

  2. 浅述python中range()函数的用法

    函数用法说明: 用法一:range(m) 输出: [0,1,...,m-1](从0到m-1的一个list,不包括m) 示例: 用法二:range(m,n),m<n 输出:[m,m+1,..,n- ...

  3. c++用vector创建二维数组

    1 vector二维数组的创建和初始化 std::vector <int> vec(10,90); //将10个一维动态数组初始为90std::vector<std::vector& ...

  4. jquery slibings选取同级其他元素

    jquery选取同级其他元素可以使用slibings方法,end方法可以清除之前的链式操作,相当于重新开始. <script type="text/javascript"&g ...

  5. c++智能指针,new之后不需要delete,简单的垃圾回收

    http://www.cnblogs.com/TenosDoIt/p/3456704.html 智能指针的初始化: 错误: std::shared_ptr<Serializer> seri ...

  6. 一.MySQL入门基础

    1.关于cmd界面无法启动mysql: 1)必须要使用管理员身份运行cmd程序 2)如果下载MySQL5.7版本的,在windows服务上Mysql的名字默认是MySQL57,因此在cmd运行 net ...

  7. 007-Centos 7.x 安装 Mysql 5.7.13

    1. 下载mysql的repo源 CentOS 7.2的yum源中默认没有mysql,要先下载mysql的repo源 wget http://repo.mysql.com/mysql57-commun ...

  8. BeanUtils.copyProperties()

    BeanUtils.copyProperties() PropertyUtils.copyProperties() 通过反射将一个对象的值赋值个另外一个对象(前提是对象中属性的名字相同). 后付前 P ...

  9. Jenkins+maven+Tomcat+SVN一键自动打包部署应用到服务器

    今天请教了大神,终于把jenkins给搞明白了 现在做下笔记,防止自己老年痴呆又忘了怎么配置 (截图可能不够清晰,有不清楚的随时评论打call) 机器配置: 安装配置规划 机器 192.168.169 ...

  10. 简明python教程四-----模块

    模块基本是一个包含了所有你定义的函数和变量的文件.为了在其他程序中重用模块,模块的文件名必须以.py为扩展名. #!/usr/bin/python #Filename:using_sys.py imp ...