20181028_ARTS_week18

第十八周,算法题 Implement strStr(),看了一篇介绍 HTML5 开源视频播放组件的文章,介绍了 ES6 中模板字符串的用法,分享了这周在做 angularJS 相关重构的时候对 angularJS 的一些想法。

Algorithm

/**
 * Implement strStr()
 * https://leetcode.com/problems/implement-strstr/
 * 
 * @param {string} haystack
 * @param {string} needle
 * @return {number}
 */
var strStr = function (haystack, needle) {
    var step = needle.length;
    var len = haystack.length;
    var i = 0;

    // when needle is an empty string
    // if (step == 0) {
    //     return 0;
    // }

    while (step <= len) {
        if (needle == haystack.substring(i, i+step)) {
            return i
        }
        i += 1;
        len -= 1;
    }

    return -1
};

console.log(strStr("hello", "ll"))
console.log(strStr("aaaaa", "bba"))

比较简单的题目,第一反应直接可以用自带的 indexOf 之类的去解决。除此之外就可以用个 while 循环一个个比一下就搞定了。

Review

5 Open Source HTML5 Video Players for 2018

https://blog.bitsrc.io/5-open-source-html5-video-players-for-2018-38fa85932afb

文章介绍了 5 个开源基于 HTML 的视频播放组件。

随着移动网络速度的提高和资费的降低,视频的需求也越来越旺盛,作者先是说了几个用开源视频播放组件的好处,基本上都是大家知道的,比如免费。之后介绍了 5 个播放组件,分别是 Plyr, Video.js, Afterglow, MediaElement.js, jPlayer。

这里面我只用过 jPlayer,感觉还不错,挺简单的。

Tip

介绍一下 ES6 里面的模板字符串。

以前我们要组合一些字符串是这样做的:

var firstName = 'Jake';
var lastName = 'Rawr';
console.log('My name is ' + firstName + ' ' + lastName);
// My name is Jake Rawr**

非常蛋疼,偏偏经常要组合字符串。

ES6 后可以这样做:

var firstName = 'Jake';
var lastName = 'Rawr';
console.log(`My name is ${firstName} ${lastName}`);
// My name is Jake Rawr

然后这个里面还可以做点运算:

var val1 = 1, val2 = 2;
console.log(`${val1} is ${val1 < val2 ? 'less than': 'greater than'} ${val2}`)
// 1 is less than 2

我个人不建议把复杂运算放这里做,代码看起来很奇怪,不优雅。

来源 https://www.jstips.co/en/javascript/template-strings/

Share

公司以前有个老项目使用 angularJS (angularJS 不是 Angular,也就是 1.0)做的,这周准备对它进行一些重构,改为用 Vue 来做。做之前当然需要去了解下 angularJS 的东东。

现在网上对 angularJS 可以说是『鄙视』了,什么老啊,旧啊,性能不好啊,工程化不完善啊等等。站在今天来看,跟今天的很多前端框架比,angularJS 的确已经落伍。

但要知道 angularJS 大概是 2008 年推出的,几乎是 node 差不多时间。站在那时候看 angularJS 还是非常先进的,组件,模板,依赖倒转,自动更新……这些在当时可以说是杀手级的特性了。

只是时代变迁,可能是开发的时候缺乏 node 之类的编译打包工具,所以 angularJS 写出的页面非常臃肿,一堆 js 文件以及模板要做异步加载,非常影响性能和打开速度。

很多东西都是演化来的,在今天我们站在制高点怼天怼地怼框架的时候,想想框架出来的时机,以及大环境,这是前端最好的时代,也是前端最坏的时代。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

推荐阅读

  • 系统设计面试:分布式系统的关键特性

    分布式系统的关键特性包括可伸缩性、可靠性、可用性、效率和可管理性。让我们简单回顾一下

    小诚信驿站
    分布式架构设计微服务架构微服务
  • 我是如何突围传统行业的?

    自我介绍下,四年工作经验,头两年全栈开发,后两年专职做前端,目前已达到高级前端工程师水平,经历过三家公司。第一家公司,电商行业,做阿里 ISV 供应商,为淘宝卖家服务,也是我第一次接触百万 UV 级别的产品,在第一家公司呆了两年,由于达到技术瓶颈期,遂跳槽,第二家公司,航运物流行业,呆了六个月(工作强度对我来说,是真的高),身体不适,没有同意转正。目前这家,担任项目管理和前端组长,两个角色,目前呆了两年,做了很多东西,把自己的一些想法跟大家聊一聊。

    发声的沉默者
  • 关于 TRTC (实时音视频通话模式)在我司的实践

    腾讯实时音视频(Tencent Real-Time Communication,TRTC)将腾讯 21 年来在网络与音视频技术上的深度积累,以多人音视频通话和低延时互动直播两大场景化方案,通过腾讯云服务向开发者开放,致力于帮助开发者快速搭建低成本、低延时、高品质的音视频互动解决方案。

    发声的沉默者
    实时音视频ReactVue.js微信小程序音视频小程序
  • 从零搭建 Vite + React 开发环境

    大概在 2019 年,自己搭建 React 开发环境的想法萌芽,到目前为止,公司的很多项目上,也在使用中,比较稳定。为什么要自己造轮子?起初是因为自己并不满意市面上的脚手架。另外,造轮子对于自己也有一些技术上的帮助,学别人二次封装的东西,不如直接使用底层的库,这样也有助于自己系统的学习一遍知识,最近 Vite 很火,所以用 Vite 搭建一波,废话不多说,直接进入正文,如何搭建自己的开发环境。

    发声的沉默者
    JavaScriptReactHTML打包
  • 企业借助云平台“一站式”容灾建设?

    随着业务对持续性要求越来越高,云上不少企业对跨AZ或多地域的容灾建设有强烈的诉求。当企业内部经过评估选定容灾建设整体方向,即同城双活;需要对方案进行验证,包括组件容灾能力建设,数据同步以及切换验证等。通常对组件容灾能力建设和验证会花费大量时间,如果测试不符合预期,对之前调研、部署以及测试人力和时间成本带来较大耗费。因此借助云平台能力“一站式”提升系统容灾能力,助力企业降本增效。

    开元
    云服务器系统架构架构设计运维解决方案
  • 源码篇:Flutter Bloc背后的思想,一篇纠结的文章

    用过Bloc的靓仔们,肯定能感受到,Bloc框架对开发页面,做了很清晰划分,框架强行定了俩种开发模式

    小呆呆666
    AndroidAndroid StudioFlutteriOS
  • 一篇文章、三种方法在Debian上轻松安装Nginx

    “Nginx 是一款轻量级的 HTTP 服务器,采用事件驱动的异步非阻塞处理方式框架,这让其具有极好的 IO 性能,时常用于服务端的反向代理和负载均衡。”

    Mintimate
    NginxLinux轻量应用服务器 LighthouseDocker网站
  • 日入过亿爬虫系统搭建的思与想

    在不久之前,有几位朋友问我,大规模抓取是如何实现的?说实话,其实我也并确定自己一定是正确且完整的,不过我数量级并不难以实现。下面说说我是从哪几个方面进行聚焦爬虫相关优化的,同时如果你有更好的方法欢迎您与我探讨。

    PayneWu
  • TKE部署kubord

    kubord部署很简单,获取部署的yaml,直接kubectl命令部署这个yaml即可

    聂伟星
  • [ webpack ] webpack 的 loader 和 plugin 开发的方法

    loader 主要的是处理静态资源,而 plugins 是可以贯穿在整个 webpack 构建的周期中,他能做到 loader 做不到的事情。但是,loader 他可以用独立的运行环境,可以在本地使用一些库进行本地发发调制,而 plugins 不行,他必须编写好这个 plugin 之后在 webpack 构建中将 plugin 放在 plugins 的数组中执行。

    GavinUI
    webpack

扫码关注云+社区

领取腾讯云代金券