black

NutUI CLI源码解析

冷暖自知 提交于 2020-03-25 07:14:33
3 月,跳不动了?>>> 前言 NodeJs的出现,让前端工程化的理念不断深入。先是带来了Gulp、Webpack等强大的构建工具,随后又出现了 vue-cli 和 create-react-app 等完善的脚手架,提供了完整的项目架构,让我们可以更多的关注业务,而不必在项目基础设施上花费大量时间。 但是,这些现成的脚手架未必就能满足我们的业务需求,也未必是最佳实践,相信每个大公司都有定制开发的的脚手架,今天我们来读一下京东 NutUI 组件库中的内置脚手架 NutUI-CLI NutUI CLI 简介 NutUI-CLI 是一个 Vue 组件库构建工具,通过它可以搭建一套 Vue 组件库 功能 dev 本地调试运行 官网和Demo示例 add 快速创建符合 NutUI 的标准组件 build 构建组件库,生成可用于 生产环境的组件代码 build-site 构建组件库 官网+Demo示例网站 ... 为了让大家快速的了解内部逻辑,我梳理了一个脑图供大家参考 NutUI-CLI 源码地址 github.com/jdf2e/nutui… 具体程序流程顺序可分为 入口命令脚本接受/分发器 > 命令接收器 > 编译逻辑处理 > webpack配置 1. 入口命令脚本接受/分发器 CLI 在 NutUI 中是如何被调用起来的 相信大家对下面 @vue/cli 脚手架的命令并不陌生 $

Google 官方 Channel 盖戳:谷歌面试官眼中的优秀简历长什么样?

限于喜欢 提交于 2020-03-24 00:05:36
3 月,跳不动了?>>> Google的招聘官对想要申请Google岗位的同学提供了一些具体的提示和建议,帮助大家撰写和准备简历从人群中脱颖而出,其中包括业务,工程和技术职位的示例。主要从Resume Basics,Education,Experience,Optional section等几方面展开讲解,同时详细说明了如何用搞笑有说服力的方式来描述你曾经做过的Project。 Format • Use simple and consistent design, font, sizing and spacing • Use black or dark, readable ink • Format as PDF Content • Include your contact information and email at the top • Don’t have to include objective statements • Don’t need to include references Length • Keep to one page for business and internship roles, and no longer than two pages for engineering and technical roles • Include what’s

【笔试题👋】分享一道有意思的arguments笔试题

主宰稳场 提交于 2020-03-23 19:26:11
3 月,跳不动了?>>> 前言 你盼世界,我盼望你无 bug 。Hello 大家好!我是霖呆呆! 这篇文章很短...但绝对不是一篇水文... 主要是在评论区看到了,觉得是我们平常会忽略的一个小知识点而且笔试也有可能碰到,所以单独作为一篇文章来写,还请花个2分钟来看看吧,万一真给碰上了呢 😁。 (题目来源:掘友 Lazzw ,感谢该小伙伴的提出) 正题 题目是这样的: var obj = { age : 18 , foo : function ( func ) { func() arguments [ 0 ]() } } var age = 10 function temp ( ) { console .log( this .age) } obj.foo(temp) 复制代码 不卖关子,咱先上答案: 10 undefined 复制代码 之前我们一直只在意函数中最常用的隐藏参数 this ,而这道题其实就考到了函数中隐藏的另一个参数 arguments 。 先简单说明一下 arguments 的作用再来看这道题吧。 arguments 参数是传递给函数的所有参数的集合(类数组结构),例如下面这两个例子: function test1 ( ) { console .log( arguments ) } function test2 ( a ) { console .log(a)

Python第二周作业

随声附和 提交于 2020-03-21 10:51:36
绘制五角星 1 import turtle 2 3 turtle.color('black','red') 4 turtle.pensize(10) 5 turtle.begin_fill() 6 for i in range(5): 7 turtle.fd(200) 8 turtle.rt(144) 9 10 turtle.end_fill() Superstar 绘制一组同心圆 从键盘输入半径、绘制同心圆的个数及画笔的颜色 1 import turtle 2 3 turtle.pensize(10) 4 5 r=eval(input()) 6 n=eval(input()) 7 color=input() 8 turtle.pencolor(color) 9 10 for i in range(n): 11 turtle.circle(r+(i-1)*20,360)#每个同心圆的半径差为20 12 turtle.penup() 13 turtle.right(90) 14 turtle.forward(20) 15 turtle.left(90) 16 turtle.pendown() 同心圆 键盘输入: 20 4 red 绘制渐变的圆 描述 利用turtle库的circle(50)函数可以画半径为50的圆,circle(50,steps=n)可以画半径为50的圆的内接正n边形

Vue源码探秘(一)

…衆ロ難τιáo~ 提交于 2020-03-21 03:37:20
3 月,跳不动了?>>> 引言 Vue 作为当前前端开发中比较重要的框架,在企业级开发中应用十分广泛。目前也是我的主要技术栈之一。在接下来的系列文章中,我将带大家一起探秘 Vue.js 底层源码。 本篇文章是 Vue源码探秘 的第一篇。在这一篇中,我主要是带大家做一些准备工作,介绍一下 flow 、 源码目录 和 源码构建流程 。 认识flow flow 是 facebook 出品的 JavaScript 静态类型检查工具。 Vue.js 的源码利用了 flow 来做静态类型检查,所以了解 flow 有助于我们阅读源码。 为什么用 flow JavaScript 是动态类型语言,它的灵活性有目共睹,但是过于灵活的副作用就是很容易就写出非常隐蔽的隐患代码,在编译期甚至运行时看上去都不会报错,但是可能会发生各种各样奇怪的和难以解决的 bug。 项目越复杂就越需要通过工具的手段来保证项目的维护性和增强代码的可读性。 Vue.js 在做 2.0 重构的时候,在 ES2015 的基础上,除了 ESLint 保证代码风格之外,也引入了 flow 做静态类型检查。 flow 在 Vue.js 源码中的应用 flow 常用的两种类型检查方式是: 类型推断 :通过变量的使用上下文来推断出变量类型,然后根据这些推断来检查类型。 类型注释 :事先注释好我们期待的类型,flow 会基于这些注释来判断。 在

Google 官方 Channel 盖戳:谷歌面试官眼中的优秀简历长什么样?

回眸只為那壹抹淺笑 提交于 2020-03-21 01:43:14
3 月,跳不动了?>>> Google的招聘官对想要申请Google岗位的同学提供了一些具体的提示和建议,帮助大家撰写和准备简历从人群中脱颖而出,其中包括业务,工程和技术职位的示例。主要从Resume Basics,Education,Experience,Optional section等几方面展开讲解,同时详细说明了如何用搞笑有说服力的方式来描述你曾经做过的Project。 Format • Use simple and consistent design, font, sizing and spacing • Use black or dark, readable ink • Format as PDF Content • Include your contact information and email at the top • Don’t have to include objective statements • Don’t need to include references Length • Keep to one page for business and internship roles, and no longer than two pages for engineering and technical roles • Include what’s

exisits的使用

柔情痞子 提交于 2020-03-20 18:30:55
3 月,跳不动了?>>> 简单使用就是 SELECT COUNT(1) FROM risk_black_list rb WHERE EXISTS( SELECT if(LEFT(mobile,1) = 0, SUBSTR(mobile ,2 ,LENGTH(mobile)) , mobile) FROM risk_user_address_book_info r WHERE risk_case_id=7664 and if(LEFT(rb.mobile,1) = 0, SUBSTR(rb.mobile ,2 ,LENGTH(rb.mobile)) , rb.mobile) = if(LEFT(r.mobile,1) = 0, SUBSTR(r.mobile ,2 ,LENGTH(r.mobile)) , r.mobile) ); 简单说就是rb表 与r 表有关联字段。并且 关联逻辑在子查询中,且子查询返回结果集可以与管理字段无关,即可实现。 其原理就是 EXISTS 会对外表rb进行循环查询匹配,它不在乎后面的内表子查询的返回值是什么,只在乎有没有存在返回值,存在返回值,则条件为真,该条数据匹配成功,加入查询结果集中;如果没有返回值,条件为假,丢弃该条数据。 子查询可以使用索引,但外查询要全表扫描 来源: oschina 链接: https://my.oschina.net/u

怎么分辨滑板的前后(从正面)?

我与影子孤独终老i 提交于 2020-03-20 14:52:59
3 月,跳不动了?>>> 从第一块滑板80年代末期出现在中国到现在保守的估计也有二十多年了,在这期间无数的人其实一直做着滑板知识普及的工作,所以现在可以松一口气了……当然不行!仍然有买滑板的人不知道板头和板尾其实是有区别的!因为今天有一位经销商对我的同事说要求换板,他的客户说:板头和板尾不一样宽,这种“次品”必须换货!好吧!你说换就换!我偏不换!当然不是因为我耍无赖,而是因为…… 首先,如果前后没有区别,为什么要叫板头(Nose)和板尾(Tail)…… 我们要从世界上第一块滑板说起 第一块板头板尾开始相似的滑板说起吧,因为更早的时候滑板动作还不多,板头就是一个尖尖头,板尾就是一个又大又宽的翘起,所以很容易区分咱们就不多说了。 上个世纪80年代街式滑板流行了,在中后期甚至把U池滑板推到了边缘,我想这才是滑板真正的开始“滑与毁”,而更多的以ollie为代表的平地起跳动作对滑板的形状也产生了新的要求——板头需要更多翘起来挡住ollie时带板的前脚,也可能需要更宽的板头。1989年,改变这一切的就是Mike Vallely这个人,他当时在World Industries推出了自己的签名款,这款板大概是9寸多的宽度,但是可以看到它和现在我们用的滑板已经非常接近了哦! 板头板尾为什么要有区别? 1.板头为什么要翘的高?有时候还要做得宽? ——前面说了,在ollie时候板头可以接住前脚

python lib

二次信任 提交于 2020-03-17 12:10:25
某厂面试归来,发现自己落伍了!>>> 7 essential PyPI libraries and how to use them Solve common Python problems by learning how to use these seven Python Package Index (PyPI) libraries. 7_essential_pypl_libraries-cover.jpg Download guide to 7 essential PyPI libraries Python is one of the most popular programming languages in use today—and for good reasons: it's open source, it has a wide range of uses (such as web programming, business applications, games, scientific programming, and much more), and it has a vibrant and dedicated community supporting it. In this guide, we'll look at seven Python Package Index

前端入门小游戏---踩砖块

帅比萌擦擦* 提交于 2020-03-01 03:23:36
效果图: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>踩砖块</title> <style> body{ margin:0; background: url("image/6421482_154553076000_2.jpg") no-repeat center/cover; } #frame{ width:416px; height:406px; border-top:4px solid blue; border-bottom:2px dashed blue; margin:-210px auto auto auto; overflow:hidden; } #moveblock{ position:relative; top:-100px; width:416px; height:416px; } .row{ width:416px; height:104px; } .row div{ width:100px; height:100px; float:left; border:2px solid gray; } .black{ background-color: black; } #lefttop{ width:200px; height:200px; margin:0px 350px