资讯专栏INFORMATION COLUMN

记录一些日常的小问题(前端)

missonce / 3494人阅读

摘要:多重循环遍历查找优化开发中经常会遇到需要在一个数组中查找某一个对象的问题,单纯用循环语句循环查找。一篇写得很好的对对象进行讲解的文章函数是的一等公民,即最小作用域是函数。利用静态属性挂载在原型上的属性访问作用域中的变量。

1、多重循环遍历查找优化
开发中经常会遇到需要在一个数组中查找某一个对象的问题,单纯用for循环语句循环查找。(typescript)
之前写的是这样的

 inManual(search, manual) {
    for (let i = 0; i < search.length; i++) {
        for (let j = 0; j < manual.users.length; j++) {
            for (let k = 0; k < manual.users[j].contacts.length; k++) {
                if (search[i].phone == manual.users[j].contacts[k].phone) {
                    search[i].state = 1;
                }
            }
        }
    }
    return search;
}

无论有没有找到,这样做都需要全部循环一遍性能太浪费,需要用break来及时跳出此次循环。然而需要跳出多重循环,也就可以改变下用return
优化后的代码:

for (let i = 0; i < search.length; i++) {
            this.isAdd(i);
}
isAdd(i) {
    for (let j = 0; j < manual.users.length; j++) {
        for (let k = 0; k < manual.users[j].contacts.length; k++) {
            if (search[i].phone == manual.users[j].contacts[k].phone) {
                search[i].state = 1;
                return;
            }
        }
    }
}

2、ionic4中弹出组件是需要异步操作的,但有时候需要在一个同步方法中,进行弹出,即同步方法如何有效包含异步操作
正常的异步操作:

async click(){
    const alert = await this.alertCtrl.create({
            header: "请输入手机号!",
            buttons: ["确定"]
        });
    await alert.present();
 }

将click方法同步后的代码:

click(){
    this.alertCtrl.create({
            header: "请输入手机号!",
            buttons: ["确定"]
        }).then((alert) => {
            alert.present();
        });
}

3、js对象转换成JSON对象,使用stringfy()方法进行转换,但在转换过程中需要注意,会自动把js对象的属性值为undefined的属性去掉。
一篇写得很好的对json对象进行讲解的文章https://segmentfault.com/a/11...
4、函数是js的一等公民,即最小作用域是函数。js没有私有成员的概念,所有对象属性都是公有的,但有私有变量。方法:
(1)利用构造函数,访问私有作用域中的变量。
(2)利用静态属性(挂载在原型上的属性)访问作用域中的变量。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/114319.html

相关文章

  • 记录一些日常的小问题前端

    摘要:多重循环遍历查找优化开发中经常会遇到需要在一个数组中查找某一个对象的问题,单纯用循环语句循环查找。一篇写得很好的对对象进行讲解的文章函数是的一等公民,即最小作用域是函数。利用静态属性挂载在原型上的属性访问作用域中的变量。 1、多重循环遍历查找优化开发中经常会遇到需要在一个数组中查找某一个对象的问题,单纯用for循环语句循环查找。(typescript)之前写的是这样的 inManua...

    NervosNetwork 评论0 收藏0
  • 你可能不知道的 npm 实用技巧

    摘要:但这并不意味着依赖版本是锁死的。黄色表示不符合指定的语义化版本范围,比如大版本升级,升级可能会遇到兼容性问题。文件可以列出不想打包的文件,避免把一些无关的文件发布到上。 作者: LeanCloud weakish 分享一些 npm 包管理工具的实用小窍门,希望能够略微提高下前端、Node.js 开发者的生活质量。 绝大多数前端和 Node.js 开发者每天的日常工作都离不开 npm,不...

    NickZhou 评论0 收藏0
  • 撸一个会话备忘录的小程序

    摘要:最终实现的撮图目的借助小程序记录微信日常会话中的重要信息,数据在本地缓存中操作,纯前端无后台,不用担心信息泄露问题。 最终实现的撮图:showImg(https://raw.githubusercontent.com/WGinit/Assets/master/images/memo/1.jpg);showImg(https://raw.githubusercontent.com/WGi...

    leon 评论0 收藏0
  • 前端经典文章

    摘要:上周末看这篇文章时,偶有灵光,所以,分享出来给大家一起看看前端面试四月二十家前端面试题分享请各位读者添加一下作者的微信公众号,以后有新的文章,将在微信公众号直接推送给各位,非常感谢。 前端切图神器 avocode 有了这个神器,切图再也腰不酸,腿不疼了。 这一次,彻底弄懂 JavaScript 执行机制 本文的目的就是要保证你彻底弄懂javascript的执行机制,如果读完本文还不懂,...

    lowett 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<