[React Native]Promise机制

React Native中经常会看到Promise机制。
Promise机制代表着在JavaScript程序中下一个伟大的范式。可以把一些复杂的代码轻松撸成一个串,和Android中的rxjava非常像。

Promise代表一个任务结果,这个任务有可能完成,有可能没有完成。Promise模式唯一需要的一个接口是调用then方法,用来注册当Promise完成或者失败时调用的回调函数。

一般异步函数用到了Promise机制。

在异步操作之前通常异步操作是借助回调函数的。

    onScuccessCallback(result){
        //...   成功的回调
    }
    onErrorCallback(error){
        //...  失败的回调
    }
    doSomething(){
        try {
            this.AsyncFunction(para,this.onScuccessCallback,this.onErrorCallback)
        }catch(errors){
            //...
        }
    }

使用Promise机制后, 就直接通过then撸成串就好了

        this.AsyncFunction(para).then(
            (para)=>{
                // 处理成功的事件
            }
        ).catch(
            (error)=>{
                // 处理失败的事件
            }
        )

这还体现不出优势来, Promise的真正强大之处在于可以方便的实现Promise的多重链接,可以参考官方的例子

  getMoviesFromApiAsync() {
    return fetch('http://facebook.github.io/react-native/movies.json')
      .then((response) => response.json())  //获取结果的json传递给下个then
      .then((responseJson) => {       //执行成功获取结果
        return responseJson.movies;
      })
      .catch((error) => {   //执行失败
        console.error(error);
      });
  }

更多精彩请关注微信公众账号likeDev

时间: 2024-07-30 13:53:56

[React Native]Promise机制的相关文章

React Native移动开发资料库

本文整理了React Native开发中额优秀博客,以及优秀的Github库列表(很多英文资料源自于awesome-react-native) 关于开源库类 Star 100+ ️ Star 200+ ️️ Star 500+ ️️️ Star 1000+ ️️️️ Star 2000+ ️️️️️ 关于博客和视频类 值得读读 ️ 建议阅读 ️️ 强烈推荐 ️️️ 目录 网址 完整开源项目 Libraries (Star 100+) 中文博客 英文博客 视频资料 网址 源代码 官方文档 reac

React Native网络请求

很多移动应用都需要从远程地址中获取数据或资源.你可能需要给某个REST API发起POST请求以提交用户数据,又或者可能仅仅需要从某个服务器上获取一些静态内容--以下就是你会用到的东西.新手可以对照这个简短的视频教程加深理解. 使用Fetch React Native提供了和web标准一致的Fetch API,用于满足开发者访问网络的需求.如果你之前使用过XMLHttpRequest(即俗称的ajax)或是其他的网络API,那么Fetch用起来将会相当容易上手.这篇文档只会列出Fetch的基本用

[React Native]获取网络状态

使用React Native,可以使用NetInfo API获取手机当前的各个网络状态. componentWillMount() { NetInfo.fetch().done((status)=> { console.log('Status:'+status); }); } 获取网络状态是异步的,上面使用了Promise机制. Android端网络状态 请求网络信息需要先在应用的AndroidManifest.xml文件中添加如下权限字段,申请相关权限: <uses-permission a

React Native JS Module 加载性能优化

关于React Native 性能 React Native 在手淘中已开始逐步推广, 在拍立淘首页的使用场景中,我们发现React Native并没有想 象中的那么快,实测效果在离线状态下性能甚至比不过H5 WindVane,React Native的UI会出现延迟渲 染存在视觉差,经过具体的代码性能测试,整个过程平均在300 ms (IPhone 5S机型下,整个JS文件 400K), 然后其核心系统调用代码加载解析整个JS (JSEvaluateScript)耗时在220 ms左右,在目前

react native在growth stack中的角色思考

Growth Hacker在国内外的互联网界近几年都是比较火热的词,互联网巨头Facebook也许是践行Growth Hacker最好的公司.然而概念吵的火并不等于做的好,如何落地Growth Hacker其实是一件比较困难的事情.最近从twitter上挖到一篇文章,推荐了MobileGrowthStack,该文章维护着关于做Growth Stack的框架,为想要落地Growth Hacker的公司提供帮助.其最主要的输出应该就是下面这样图. 稍微简单的描述下这样图.该技术栈有三个层次,分别用来

React Native在特赞的应用与实践

作者:苑永志 作者介绍:现任特赞大前端负责人.技术涉猎比较广泛,曾在大麦网担任高级Java研发工程师:后以前端工程师身份加入特赞,基于React技术栈构建开发前端项目,并使用React Native开发特赞移动APP:目前正在使用Node.js开发和维护特赞服务网关,希望Node.js能够在更轻量级的微服务架构中发挥重要作用. 一.需求缘起 特赞是在2016年末才开始着手APP开发的.记得那是距离过年还有一个月的时候,产品突然提出一个需求:咱们做一个iOS应用吧,快过年了,给设计师一个新年礼物.

《React Native移动开发实战》一一1.2 React Native的特点

1.2 React Native的特点 那么,作为跨平台应用开发的"新贵",React Native相比其他跨平台技术到底有哪些优势呢?1.2.1 其一:Learn Once, Write Anywhere 这句话是React Native官网(http://facebook.github.io/react-native/)对React Native的概述,简单明了地概括了React Native的最大特点和优点. 只需要学习React Native这一种开发方式(包括平台.语言和开发

React native for Android 初步实践

Facebook 于2015年9月15日推出react native for Android 版本, 加上2014年底已经开源的IOS版本,至此RN (react-native)真正成为跨平台的客户端框架.本篇主要是从分析代码入手,探讨一下RN在安卓平台上是如何构建一套JS的运行框架. 一. 整体架构 RN 这套框架让 JS开发者可以大部分使用JS代码就可以构建一个跨平台APP. Facebook官方说法是learn once, run everywhere, 即在Android . IOS.

React Native热更新及混合开发

随着 React Native 的不断发展完善,越来越多的公司选择使用 React Native 替代 iOS/Android 进行部分业务线的开发,也有不少使用 Hybrid 技术的公司转向了 React Native .虽然React Native在目前来说仍有不少的坑,不过对于以应用开发为主的App来说完全可以胜任. 概述 在iOS应用开发中,由于Apple严格的审核标准和低效率,iOS应用的发版速度极慢,这对于大多数团队来说是不能接受的,所以热更新对于iOS应用来说就显得尤其重要.而就在