For example we have a 'useState' function, which takes a state and a function to update the state:

  1. const useState = (state, setState) => {
  2. const newState = setState(state);
  3. if (newState != null) {
  4. return newState;
  5. } else {
  6. return state;
  7. }
  8. };

If the new state is not undefined or null, we will return newState otherwise, we return the original state.

But when we run the code like this:

  1. const res = useState([], state => state.push()); //

We expect the res to be [1, 2], but we got 2, this is because 'push' method return the length of the array as a result.

To solve the problem we can use 'void' keyword, it will execute the expression and return undefined as a result, for example:

  1. void == '' // (void 2) == '2', the same as undefined == '2', which is false
  2. void ( == '') // void false which is undefined
  1. const useState = (state, setState) => {
  2. const newState = setState(state);
  3. if (newState != null) {
  4. return newState;
  5. } else {
  6. return state;
  7. }
  8. };
  9.  
  10. const res = useState([], state => void state.push());
  11. console.log(res); //[1,2]

[Javascript] Avoid Accidental Returns of New State by using the void Keyword的更多相关文章

  1. [React] Use CSS Transitions to Avoid a Flash of Loading State

    Based on research at Facebook, we know that if a user sees a flash of loading state, they perceive t ...

  2. Javascript基础系列之(五)关键字和保留字 (keyword)

    关键字不可以作为变量名或者函数名 break case catch continue default delete do else finally for function if in instanc ...

  3. Fragment Transactions & Activity State Loss

    转自:http://www.androiddesignpatterns.com/2013/08/fragment-transaction-commit-state-loss.html The foll ...

  4. 如何精通javascript

    http://stackoverflow.com/questions/2628672/what-should-every-javascript-programmer-know Not jQuery. ...

  5. JavaScript eval() 为什么使用eval()是一个坏主意 什么时候可以使用eval()

    ---------------------------------------------------------------------------------------------------- ...

  6. --@ui-router——$state服务原版详解

    $state service in module ui.router.state Description $state service is responsible for representing ...

  7. Javascript周报#182

    This week’s JavaScript news Read this issue on the Web | Issue Archive JavaScript Weekly Issue 182Ma ...

  8. MVC控制下输出图片、javascript与json格式

    /// <summary> /// 输出图片 /// </summary> /// <returns></returns> public ActionR ...

  9. 转 创建 JavaScript XML 文档注释

    http://www.cnblogs.com/chenxizhang/archive/2009/07/12/1522058.html 如何:创建 JavaScript XML 文档注释 Visual ...

随机推荐

  1. 使用guava cache在本地缓存热点数据

    某些热点数据在短时间内可能会被成千上万次访问,所以除了放在redis之外,还可以放在本地内存,也就是JVM的内存中. 我们可以使用google的guava cache组件实现本地缓存,之所以选择gua ...

  2. Java开发笔记(一百一十二)Java11新增的HttpClient

    前面介绍了基于HttpURLConnection的网络访问请求,包括GET方式调用接口.POST方式调用接口.下载网络文件.上传本地文件这四种HTTP操作.虽然通过HttpURLConnection能 ...

  3. 函数的练习2——python编程从入门到实践

    8-9 魔术师:创建一个包含魔术师名字的列表,并将其传递一个名为show_magicians()的函数,这个函数打印列表中每个魔术师的名字. def show_magicians(magicians) ...

  4. python 之 网络编程(基于TCP协议的套接字通信操作)

    第八章网络编程 8.1 基于TCP协议的套接字通信 服务端套接字函数 s.bind() 绑定(主机,端口号)到套接字 s.listen() 开始TCP监听 s.accept() 被动接受TCP客户的连 ...

  5. hdu 1022 Train Problem I【模拟出入栈】

    Train Problem I Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)T ...

  6. NEST 字符串sort

    text字符串sort会先分词.可先建立filed字段.并设置为keyword mapping public void Mapping() { var response = client.IndexE ...

  7. OO第4次博客作业

    OO第4次博客作业 一.第4单元设计 第四单元主要围绕UML图的结构进行JAVA代码编写,对JAVA的层次结构进行更多的认识.个人认为编程操作在实质上与上一章的PathContainer有许多的相同之 ...

  8. Referer和空Referer

    参考CSDN 原文:https://blog.csdn.net/hxl188/article/details/38964743 Referer和空Referer 最近公司有个接口需要针对几个域名加白名 ...

  9. request-html 简单爬虫

    import asyncio from requests_html import HTMLSession url = 'http://www.xiaohuar.com/hua/' session = ...

  10. 2013.6.22 - OpenNE第二天

    果然看中文材料就比较顺利,才半个小时就看完了一篇非常简单的综述<命名实体识别研究进展综述>(孙镇.王惠临).这个是2010年的文章,其实就是一个 科普文章,简述了国内外NER这块的历史如何 ...