发表于 | 分类于 |

最近整理一篇关于 一些 浏览器html5 相关api 的权限的东西 虽然大部分都可以用了 但是基本上还是草案居多

本文所有的demo都在 这里 blog-demo/permission 代码在这github.com/thesadabc/blog-demo

有几个权限的demo还没有写好 之后会单独写出来

w3c.github.io/permissions: Editor’s Draft, 17 October 2016

事实上不止链接中的这几个权限, 比如usb, 本文就只对下面列出的这几个权限进行介绍

1
2
3
4
5
6
7
8
9
10
11
12
13
enum PermissionName {
      "geolocation",
      "notifications",
      "push",
      "midi",
      "camera",
      "microphone",
      "speaker",
      "device-info",
      "background-sync",
      "bluetooth",
      "persistent-storage"
}

push background-sync需要配合service worker工作

notifications 在service worker与浏览器环境中有不同

检查权限

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
navigator.permissions.query({ 
    name: "notifications", // ["notifications", "push", "midi", "background-sync"]
    //not support now: ["camera", "microphone", "speaker", "device-info", "bluetooth", "persistent-storage"]
    userVisibleOnly: false, // for "push"
    sysex: false, // for "midi"
    deviceId: null, // for ["camera", "microphone", "speaker"], 可以从`navigator.mediaDevice`接口获取
}).then((permissionStatus) => {
    let { 
        state // ["granted", "denied", "prompt"]
    } = permissionStatus;
    permissionStatus.onchange = function () {}
});

// 请求权限 目前没有浏览器实现这个接口 所以在各个接口有自己的实现
navigator.permissions.request({})
阅读全文 »

发表于 | 分类于 |

之前写过一点点 后来又看了 一篇ppt You Might Not Need CSS Preprocessor 讲了一些关于当前预处理解决的痛点以及它们缺点 并给出了使用原生css解决这些痛点的方法 然而大部分方法都还只是标准 甚至有的还是提案 浏览器实现就更少了 不过可以作为展望来期待一下美好的未来吧 算是The Future of CSS

预处理器解决的痛点:

  1. 变量 (CSS Variables)
  2. 混合 (Mixins)
  3. 嵌套 (Nesting)
  4. 模块 (Modules)
  5. 其他: 选择器辅助方法, 颜色函数等 (Selector helpers, color functions)

预处理器的缺点:

  1. 额外配置 (Additional setup)
  2. 需要编译 (Compilation)
  3. 不够标准化的语法 (Not standardized syntax)
  4. 调试困难 (Hard debug)

然后文章告诉你 这些痛点都有原生的解决办法 具体的兼容性可以查看 caniuse或者MDN或者官方标准 这些东西更新太快了 不能保证写本文的时候的标准以后不会变

阅读全文 »

发表于 | 分类于 |

之前的那个12脚扫描式4位数码管 要想显示1234这样的数字 一个扫描周期里需要四个动作 每个动作只显示一位 另外三位是不亮的 而且每次占用了大量的针脚 于是 淘宝上买了个带芯片的 4针脚的 4位数码管

本次的芯片是用的TM1637 查了一下 到处都是只有arduino的代码 而且貌似这个数码管也是标配给它的 不管 反正接口是一样的嘛

原本给arduino的代码是用c写的 还找到了另外一个python写给树莓派的 两者的代码的思路是一样的 但是还是没有看懂 说好的基本输入输出呢 两个的代码全都是直接修改pinMode来处理高低电平的 我擦泪 完全看不懂啊 为啥不用digitalWrite

反正就是这个数码管有4个脚 一个电源 一个接地 一个时钟信号 一个串行输入信号 然后看文档 文档 尼玛这什么狗屁文档 完全看不懂啊 一个是数码管的说明 一个是芯片的说明 一个是两者连接说明

阅读全文 »

发表于 | 分类于 |

这个答案要从一个题开始。

基本上所有的语言都提供了一个random方法来获取一个随机数，以js为例， Math.random() 将返回0到1之间的任意值。这个方法所有的值都是等概率的，从概率论角度来说，即该方法的概率密度函数为常量，为：p(x) = 1, x∈(0,1)
如果将随机变量做一次处理，例如平方，那么它的概率分布将会怎么样。得到下题：

如果x为(0,1)上的随机变量，且概率密度函数为p(x) = 1, x∈(0,1)，求y=x^2的概率密度函数。

这个题啊，其实很简单，如果是当初大一的时候还在上概率论的课，两分钟就解出来了。不过虽然很久没接触概率论，花点时间还是能解出来的。

阅读全文 »

发表于 | 分类于 |

原文地址https://blog.risingstack.com/node-js-best-practices-2017

使用ES2015

Last year we advised you to use ES2015 - however, a lot has changed since.

去年我们就建议你使用ES2015 - 但是还是有太多变化了。

Back then, Node.js v4 was the LTS version, and it had support for 57% of the ES2015 functionality. A year passed and ES2015 support grew to 99% with Node v6.

回到年初，Node.js V4还是LTS版，已经支持了57%的ES2015语法。一年过后，Node V6版本对ES2015支持度已经长到99%了。

If you are on the latest Node.js LTS version you don’t need babel anymore to use the whole feature set of ES2015. But even with this said, on the client side you’ll probably still need it!

如果你在使用最新的Node.jsLTS版本的话，你就不需要再使用babel来支持ES2015的所有语法了。但是虽然这样，浏览器端你可能还是需要使用的。

For more information on which Node.js version supports which ES2015 features, I’d recommend checking out node.green.

要查看更多的Node.js版本对ES2015支持度，我建议你看这个node.green。

阅读全文 »

发表于 | 分类于 |

本来是想学习一下path的 然后顺便就把svg也都看完了 小整理了一下基础的语法

基本元素 及其属性

1
2
3
4
5
6
7
8
9
10
11
12
13
{
    rect: ["x", "y", "rx", "ry", "width", "height"],
    circle: ["cx", "cy", "r"],
    ellipse: ["cx", "cy", "rx", "ry"],
    line: ["x1", "x2", "y1", "y2"],
    polyline: ["points"],
    polygon: ["points"],
    path: ["d"],
    text: {
        textPath: ["xlink:href", /* 各种样式 */],  // 文本排列path  需要 xmlns:xlink="http://www.w3.org/1999/xlink"
        tspan: ["x", "dx",  "rotate", /* 各种样式 */],
    }
}

公共属性

1
["fill", "fill-opacity", "stroke", "stroke-opacity"]
阅读全文 »

发表于 | 分类于 |

最近比较空 闲的没事 想搞搞硬件 因为是软件工程 硬件硬件相关的不太了解 虽然二级专业是信息工程 有dsp的课程 但是dsp太复杂了。。搞不懂。。。当时学的云里雾里 实验课拿到板子也完全不知道搞啥 而且板子也是相当专业的数字信号处理器 其实有点想学嵌入式专业的一些基础的课程 51开发板啊汇编语言啊什么的 可惜没有机会 于是心血来潮 最近想搞个板子玩玩 自己搞个智能玩具什么的

强烈建议没有linux使用经验先去研究一些linux相关的知识和操作再来 因为本文从安装到使用基本都是在命令行下进行的

购买

板子很多 但是对初学者来说 选择不多 树莓派相比51这些 算是比较容易学习使用的了 51开发板因为没有系统 所以代码写完之后需要编译然后导入到板子上 而且开发的语言选择也不多 而树莓派可以安装平时熟悉的操作系统 所以开发成本降低了非常多 但是树莓派还是有点贵 而且配件也贵 听说国产有个兼容树莓派的 orange pi的。。。 感兴趣的可以试试看 嗯嗯 还有国产龙芯的板子 也可以一试有机会 为了方便 还是直接买树莓派了 买的时候有坑 只有裸板 连电源都没有 另外的配件注意几个点

阅读全文 »

发表于 | 分类于 |

《资深Web技术专家曹刘阳：2016年前端技术观察》

花了一点时间看完文章 看前面的时候差点弃了 不过后面的内容还是比较认同的 最近的前端有一种想统一世界的感觉 然后成为了其他各个语言众矢之的

每个人对前端技术圈的看法以及对每个事物的优劣分界线不一样 一个对比 babel与sass 两个工具都是预处理工具 让代码更容易维护 缺点在文章中也说了 但是我看来 sass的优点大于缺点 值得使用 而babel相反 所以前端这些每个人都是可以有自己的想法的 文章的内容激进了一些 全盘都否定了 文章的作者应该是相当保守的 不过总的来说我也是保守派 

我用ng2也用vue2 但我知道我是一个保守的前端

大概就是这种感觉 所以啊 要有辩证的思维 辩证的思维啊

有人说马克思哲学为啥是真理呢 因为是辩证的 好的方面和坏的方面都说自包含的说完了 其他人都无话可说

前端这么发展当然是相当好的啊 运气比较好刚好赶上前端这次的发展

前端的发展感觉比较特殊 其他的技术从发展到成熟 基本上都是在整个行业发展水平还不是很高的情况下进行的 而前端是已经在互联网发展相对比较成熟的情况下发展的 所以前端有太多的其他技术的前辈作为借鉴 有一种一个学期就把牛顿莱布尼茨一些人研究了一辈子的微积分全部知识点学到手的学霸的感觉 很强

听说 前端的框架大战阶段还没结束 不过应该还是比较稳了已经 因为至少ES6已经确定了 而且今年已经基本上都可以使用了

发表于 | 分类于 |

最近这两周被部门没啥事 上周两个会 一个D2 一个 CSS Conf 网上找了一些其他人写的东西看了下 学到了几个东西 有没有用就不知道了 也不是都是新的特性 有几个存在都很久了 但是用的不多 实际上可能还挺好用的 也记录一下

1. 长度单位: vm, vh, vmin, vmax

这个在移动端非常有用, 感受一下这个相应式排版 看到的时候相当震惊

2. css函数: counter, calc, attr

attr 暂时没啥用 之直接获取元素的属性 支持度也不高 而且这个属性有点不伦不类 估计我应该不会用

conter 一般和counter-reset属性一起用 用处也不大

calc 这个很早之前就知道了 之前只知道可以做左边固定宽度，右边填满容器的布局 但是这个和css变量一起 就相当牛比了

这里还有过题外 很久很久之前 有个学长还是谁和我说 不要用calc 忘了啥原因了 然后我就一直对这个函数很抵触 这几天看了好几天资料都还没能缓过来 现在想来是不是被那个学长坑惨了 说不定人家只是随便一说 就完全改变了对一个技术的看法 说不定这个函数功能其实还挺强大

阅读全文 »