- 博客(95)
- 资源 (3)
- 收藏
- 关注
原创 科班小前端的大厂求职路
本人今年研一,两年制硕士,今年实习。本科前半段迷茫在科班的基础理论学习和课程作业中,大一大二对前端一无所知,没想关心太多,只想保研就好。大二暑假参加一项学校项目,第一次接触前端,一脸茫然,发现软件工程还有很多值得探寻的地方。大三保研形势已定,于是参加各种比赛,摸索自己的兴趣所在,终于在一系列比赛种尝到了前端的甜头——原来好看的页面这么吃香(当时就是这么粗浅的认识),于是决定正式入坑,带着起初“前端...
2020-03-31 10:14:18
667
原创 Flutter典型错误:There are multiple heroes that share the same tag within a subtree.
这段错误信息描述通常如下:‘Within each subtree for which heroes are to be animated (i.e. a PageRoute subtree), each Hero must have a unique non-null tag. In this case, multiple heroes had the following tag: <de...
2020-03-29 21:20:58
4622
2
原创 2020年还问position:absolute,就别怪我装逼了
CSS的position属性常常被面试官拿出来考校同学的前端基本功,分别回答几个属性值是static、absolute、relative、fixed、sticky并解答一些基本特性(直接百度得到的)可以算及格,想要进一步catch their eyes,需要更深入的理解,这里视角汇聚到absolute上,看看这个最具代表性的值能做多少文章。一重天绝对定位,top,right,bottom ...
2020-03-20 20:52:19
702
原创 HR终极一问:为啥选择前端?答:混口饭吃。卒。(附网易面经)
持续面试一个多月,几乎每个大厂都配备了这道前端“送命题”,懂的人都懂,这得像哄女朋友一样,把我们对前端的热情和兴趣传达给面试官,这最后一关才算稳妥,万万不可唐突。咱第一次回答时真情实感自然流露,颇有“我和我的前端,一刻也不能分割~”之势,不过一遍又一遍重复这个剧本,我渐渐失去了感情,甚至忍不住脱口而出:“咱家不就混口饭吃嘛,还要即兴发挥篇作文歌颂下伟大的前端事业不成?”玩笑归玩笑,吐槽归吐槽,话还...
2020-03-19 20:47:26
2613
原创 升级Chrome80后Cookie怎么都无法传输?SameSite属性了解一下
Cookie内的SameSite属性负责管控跨站请求是否附加cookie的策略,有如下三种配置:SameSite=Strict:所有跨站请求都不附带cookie。SameSite=Lax:部分跨站请求可以附带cookie,但是XHR(ajax)、jsonp、表单的post、iframe、img这些常用形式都不会附带cookie,而Chrome80对cookie的默认设置就是SameSite...
2020-03-19 12:06:27
1258
原创 瞧这憨憨的操作,Windows看笑了,Flutter也来凑热闹?文件名千万别带空格!
经此一役,以后我的pc任何文件名都不会出现空格的身影了,I promise。一切始于我需要将一个名为‘software engineer’的文件夹下的Flutter项目x,上传到远端linux服务器上。上过Linux课的我迅速敲下scp命令,不料Windows嘿嘿一笑,想不到我不支持ssh传输吧,看你咋整。我微微一怔,迅速想到git命令行支持scp,于是启动git bash,继续上面步骤,然而...
2020-02-18 19:54:12
451
原创 React16生命周期误用及改正
React16.3采用异步更新机制,在页面组件并不复杂的情况下,我们在屏幕外似乎捕捉到的区别并不明显,其实框架内部已经发生重大变革,配套新的更新机制,组件的生命周期有所调整,废弃了三个旧生命周期,同时React官方也对新生命周期的使用做出了指导。下面列举就我自己项目开发中总结的生命周期中最常见的不当操作以及正确姿势:在componentDidUpdate中setState导致组件无限被更新,影...
2020-02-16 21:12:27
221
原创 Flutter基础:最外层组件被拉伸
其实标题就是我想讲的内容:Flutter在最外层的布局类组件Column或Row等,在主轴和交叉轴方向上都被拉伸至撑满整个屏幕。为什么单独拿出来说?因为它们在交叉轴上的宽度本来是最大子元素宽度决定的,而这里打破了这个法则,最外层组件相当于被限制了宽高必须撑满屏幕。主轴上撑满屏幕的效果乍一看好像符合Column和Row的高度计算定义,那是因为它们默认情况下mainAxisSize:MainAxis...
2020-02-04 10:49:24
3147
原创 Flutter基础:布局出了问题,为什么我的Column用不好?
满怀信心使用Column进行布局,总会遇到各种各样异常,有的直接报错,有的表现形式和预想的不同。下面直接分场景归纳并解决Column中的问题(大多数布局问题都有Column这货参与):1.Column中嵌套Column,外层Column直接撑满屏幕,而内层Column只是刚好为子元素高度(子元素没有Flexible类型组件)2.Column中嵌套Column,内层Column有Expand...
2020-02-03 22:08:13
4697
3
原创 Flutter基础:Flutter的Flex布局理论以及和web的区别
Flutter的布局其实比web更简单直接,万物皆可Column与Row,这两个Flex类型组件将屏幕方方正正划分,其中Column组件让人又爱又恨,首先它让垂直方向的高度不再像web中那么难以控制,如果你在根组件中直接使用Column做最外层容器,它的默认高度就是屏幕高度,子组件又有Expanded能划分剩余空间,是不是很舒服?web中想对高度精确控制还要html,body都来个height:1...
2020-02-03 14:07:35
738
原创 Flutter实战:可滚动组件布局的良好实践
初入Flutter,经常直接将根组件设为Column,不断向其中添加组件,组件堆叠到一定高度溢出屏幕,屏幕底部会显示一段很小的“乱码”,不必惊慌,它只是告诉你溢出了多少。这时希望溢出容器内容产生滚动条,然而Flutter并没有传统web那么方便,所谓一个overflow属性搞定,我们不得不给Column包裹额外一层可滚动组件作为容器。Flutter中的可滚动组件有:SingleChildScr...
2020-02-02 12:52:47
3562
原创 Flutter使用可滚动组件(SingleChildScrollView,ListView,GridView)时的典型错误二
当一个可滚动组件中嵌套另一个可滚动组件时,会抛出如下错误信息:The following assertion was thrown during performResize():Vertical viewport was given unbounded height.Viewports expand in the scrolling direction to fill their cont...
2020-02-02 09:52:33
3829
1
原创 Flutter upgrade更新版本后run项目显示no device
开着项目运行了flutter upgrade更新版本后,有时dart也更新了版本,会给所有项目加上一个启动锁,重新run会抛出如下信息:Waiting for another flutter command to release the startup lock。在命令行中运行各类flutter命令也会抛出同样的错误。重启编辑器试试?然而重启后VS Code或者Android Studio显示识别...
2020-02-01 11:50:42
1058
原创 Flutter使用可滚动组件(SingleChildScrollView,ListView,GridView)时的典型错误
话不多说,直接丢报错信息,看看自己是否遇到:The following assertion was thrown during performLayout():RenderFlex children have non-zero flex but incoming height constraints are unbounded.When a column is in a parent th...
2020-01-31 20:06:01
3324
原创 Flutter web项目发布
讲道理在本机测试发布只要按照官网教程:https://flutter.dev/docs/deployment/web不过在本机启动服务端口的命令python -m SimpleHTTPServer 8000在python3的环境下已经改为:python -m http.server...
2020-01-12 21:59:30
1198
原创 Promise的finally并不是终结
开发时常常遇到一串Promise.then最后执行一个固定逻辑,显而易见要使用finally。日后需求扩展,需要在这段固定逻辑之后添加另外的异步逻辑——又想加一串then回调,这时候直接在finally之后调then是不是觉得心里发虚?但是又不愿意去将原本的调用链改变,多麻烦啊。仔细查看文档发现其实是可以的,Promise设计早就想到了,文档描述如下:Promise.prototype.fin...
2020-01-03 14:26:32
4528
1
原创 迈出Flutter第一步
Flutter是近两年蓬勃发展的跨平台前端开发框架,和传统Hybrid模式乃至React Native为代表的JS+原生渲染模式不同,Flutter采用原生自绘UI并暴露统一接口——致力于一次编码,各端(Android、IOS、Web、PC)部署,同时尽量保证UI在各个平台上表现形式的一致性,Flutter还有不少优势不再赘述,参见Flutter中文社区。目前Flutter稳定版本支持Andr...
2020-01-02 23:09:29
163
原创 用自己看得懂的话总结React15到React16的变化
首先要搞懂React16诞生的原因,无非就是之前版本调度、渲染效率不高,新版本引入新机制进行全面优化。React 框架内部的运作可以分为 3 层:Virtual DOM 层,描述页面长什么样。 Reconciler 层,负责调用组件生命周期方法,进行 Diff 运算等。 Renderer 层,根据不同的平台,渲染出相应的页面,比较常见的是 ReactDOM 和 ReactNative。...
2019-12-24 13:01:30
1763
原创 前后端视角看设计模式——策略模式
设计模式是经验之谈,对某些需求情况下的良好实践进行了归纳,虽然并非必须遵守的准则,却能对我们解决各类问题提供指引。不同语言拥有不同特性,对各类设计模式的支持度不尽相同,比如原型模式在js中是天然实现的,java也有内置的迭代器模式——有些泛用性强的模式,经过长年累月重复使用,最终会被固化到语言中。对不同语言使用的多了,常常能感受到不同特性间的相互碰撞。于是笔者想借助前后端两门代表性...
2019-10-29 11:28:31
234
原创 为何有好多网站不常用table和iframe这两个元素?
iframe坏处:是一个单独的容器,因此不会应用全局的CSS样式会和网页共用域名连接池,因此可能由于iframe占用了连接数导致加载阻塞搜索引擎爬虫不易爬取,不利于SEO相比直接操作DOM元素,使用iframe更耗费资源好处:可以用其展示广告,可以避免由于添加广告而网站被爬虫拒绝收录的情况table坏处:table的内容会等内部的所有内容加载完成才会显示,比基于div+css...
2019-08-04 10:46:20
1204
原创 javascript填坑——系统地认知this
完整系统的掌握this,首先得明白严格模式和非严格模式会影响this指向。1.在全局执行环境下,无论是否严格模式,this都指向全局对象,比如平时前端开发<script>标签中:// 在浏览器中, window 对象同时也是全局对象:console.log(this === window); // true2.简单调用(this没有被执行环境定义)且非严格模式下,thi...
2019-07-13 11:30:17
150
原创 javascript单线程,浏览器多线程和任务队列
入门前端时仅仅知道js单线程,了解浏览器的事件循环,常常分不清js引擎在事件 循环中扮演什么样的角色,甚至一度产生错误理解:js引擎的工作就是事件循环的全部。随着认识的拓宽和加深,了解了任务队列机制(macrotask队列和microtask队列)、浏览器事件触发和UI渲染后,明白了事件循环机制如下图所示:事件循环包含两个线程,js主线程(就是我们常说的js单线程引擎)和事件触发线程。...
2019-07-06 11:22:00
699
原创 CSS3的background-size属性
以前前端开发时写过一篇html 标签内背景图片自适应div大小,用到了background-size属性,其实也就停留在刚好用来“救急”的地步,并未仔细了解。其实background-size属性是个CSS3属性,IE9+才支持,自己做做小项目就罢了,在大公司需要考虑兼容性的情况下随手就用往往弄巧成拙。他还有五个不同取值——默认值auto、length、percentage、cover、con...
2019-03-28 16:56:00
567
原创 为什么要使用TypeScript?TypeScript和js区别在何处?
二者的主要区别为:TypeScript是静态类型,js是动态类型(详见强类型、弱类型、静态类型、动态类型的区别)。但这不意味着两者差距多大,只是类型检查的时机不同而已,TS和js根本上的差别就这一点,然而其意义却举足轻重。静态类型检查可以做到early fail,即你编写的代码即使没有被执行到,一旦你编写代码时发生类型不匹配,语言在编译阶段(解释执行也一样,可以在运行前)即可发现,同时ID...
2019-02-27 14:55:38
18504
原创 强类型、弱类型、静态类型、动态类型的区别
弱类型:容忍隐式类型转换。比如js中:1+'a'> '1a'以及c中double可以隐式转换为int强类型:不容忍隐式类型转换。比如python中:>>> "1"+2Traceback (most recent call last): File "<stdin>", line 1, in <module>TypeErro...
2019-02-27 14:24:13
1542
原创 关于大前端的思考,找准大方向
路人大可当篇技术散文来读读,但对我本人的作用是警醒和规约。上半年对前后端分离颇有感触,于是写下关于前后端分离的思考,找准大方向。前端风云,日新月异,九个月的光景竟足以让我心生烂柯之感了。回顾以前的结论,前端还在为摆脱“我不仅仅是页面,我有三大框架和node,我能在项目中有更大更明确的定位”奔走呼号,仿佛一个叛逆期的少年,在后端爸爸和产品妈妈的屋檐下闹腾。如今,"儿已成人,当游历四海,遍访豪杰,...
2018-12-21 16:44:25
849
原创 Google API调用方式总结——前端js调用和后端各种语言调用
实习期间接到需求,期望能在.net框架下的前端调用google drive api,并持有access_token和refresh_token以保持和google api的长时间连接(单独acccess_token只能维持3600秒访问时间)。然而亲测前端使用纯js调用gapi只能获得access_token,无法同时得到refresh_token,最接近成功的方法如下:GoogleAu...
2018-08-10 13:04:44
5473
原创 Laserfiche实习记(一)
公司是一家座落在上海黄浦江畔的外企,目前国内分部规模不大,约莫30到50人,hr形容:正处于稳步扩张阶段。目前实习三天。第一天公司报到,去酒店安顿好之后回到公司配置开发环境,出身“环境配置学院”的我预感这必不简单。果然,这台电脑的前任是搞测试的,对项目进行过五花八门的测试性配置,简直是在项目无法build的边缘疯狂试探。初来乍到的我按照指示进行配置,自己尽所能躲避一些坑之后还是不敌乱七八糟的....
2018-07-26 10:01:58
1176
1
原创 overflow:hidden对于溢出到padding的内容不隐藏
盒子模型的内容区域其实包括content+padding,即padding box,虽然正常情况下元素只在content内排布,但是当内容溢出到padding也是允许的,故overflow:hidden对此不做影响。利用这个特性,我们可以使用div的padding为图片占位,防止图片加载出现抖动现象:<div class="wrapper"> <img ...
2018-06-24 20:35:12
11289
原创 html文字溢出显示省略号
直接上代码: overflow: hidden white-space: nowrap -ms-text-overflow: ellipsis text-overflow: ellipsis
2018-06-23 21:33:09
722
原创 由BFC导致的display:inline-block的特殊性
入门了前端的应该都知道inline-block是以内联块级特性,即该元素既具有块状元素的盒子模型又具有内联元素的不独占一行特性。于是结论认为inline-block和block除了不独占一行外其余特性皆相同。然而,事实并非如此纯粹简单,inline-block还具有一些细节特性,不求甚解有时会阻碍我们的布局。目前在项目实践中积累了两个细节:1.inline-block虽然具有盒子模型,但是marg...
2018-06-23 20:28:23
1057
原创 Vue项目路径别名设置
用vue-cli搭建好vue项目之后,进入正式开发过程,有时候会发现各种import路径中都存在长串的重复路径,比如:import 'src/assets/styles/reset.css'import 'src/assets/styles/border.css'为了方便维护,可以打开build文件下的webpack.base.conf.js文件,在module.exports中找到resolv...
2018-06-23 10:26:46
8536
原创 腾讯、今日头条前端面经
有一个月没写博客了,主要忙于面试准备——刷面经、刷题,《剑指offer》刷了一大半,期间一边准备一遍面试,发现前端岗位没有想象中那么好找——最早面阿里准备不足被血虐,后来面腾讯和头条感觉良好(绝大多数问题都会)却依然凉凉,到最后成功得到上海某外企小厂的offer,一路上发现自己真的有诸多不足,所以今后要夯实基础,深挖特长,秋招继续锻炼。最早的阿里面试没有存留面经,先将之后两次的失败面经分享出来,自...
2018-06-22 21:56:35
3440
转载 行内元素细分——行内置换元素和非行内置换元素
以前有个误解:行内元素没有宽高。后来在开发项目时突然发现<img>是行内元素,而它恰恰可以设置宽高。查阅资料后发现如果一个行内元素同时也是置换元素(展示内容由其属性决定),它也就可以定义宽高了。...
2018-06-22 21:36:42
322
原创 Android appium测试找不到组件问题
刚入坑Android测试,跋山涉水终于配好了所有环境但是滑动屏幕和点击按钮却莫名其妙报错,总之就是没有获取到组件。其实,问题很简单,执行到测试代码时,uiautomator还没来得及获取到该页面,所以解决方法也很简单:Thread.sleep适当的时间(根据该页内容加载的速度来定)即可。...
2018-05-22 10:01:02
878
原创 Android7手机解决无法运行appium脚本的问题
1、 找到appium的安装目录下的adb.js文件,windows版本的目录如下:Appium\node_modules\appium\node_modules\appium-adb\lib2、 打开adb.js,手动修改该文件下的内容:ADB.prototype.getPIDsByName = function (name, cb) {logger.debug("Getting all pro...
2018-05-22 09:51:09
1503
原创 Promise的执行原理——macrotask和microtask
要理解Promise的执行原理,首先要知道EMCAScript的任务队列机制——macro-task(宏任务)和micro-task(微任务)。浏览器先执行一个macrotask,在执行macrotask过程中可能会创建新的macrotask和microtask,然后顺序执行micro-task队列中的全部任务,然后再取出一个macrotask执行……周而复始。整个script代码是一个macro...
2018-05-01 11:10:15
1584
原创 react开发:从零开始搭建一个react项目
有前端基础的程序猿入门react,推荐链接:https://blog.youkuaiyun.com/generon/article/details/73921055虽然比较长但是都是要点,掌握之后基本就能上手react开发了,不过route等后续模块并没有涉及,之后我会补充。...
2018-04-21 21:45:47
2210
原创 Android自定义Toolbar的Menu图标且点击后弹出对话框
经常会碰到这样的需求:界面右上角有个图标,点击一下之后弹出一个会话框,比如举报、选择额外功能之类,很多app都要实现。现归纳一种实现方式。首先添加menu,监听菜单的点击事件,点击时弹出一个dialog:@Overridepublic boolean onCreateOptionsMenu(Menu menu) { getMenuInflater().inflate(R.menu.men...
2018-04-16 20:32:14
3388
原创 Android Toolbar使用技巧之添加toolbar和配置menu
Toolbar功能比默认的ActionBar更强大更丰富,如今按照先后渐入顺序记录Toolbar的配置(添加toolbar和配置menu)。1、修改styles,增加noactionbar状态: <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar"> <item name="colorP...
2018-04-16 20:04:41
5374
基于Spark的实践.pptx
2020-02-04
ACM全部算法
2017-09-18
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人