- 博客(207)
- 资源 (8)
- 收藏
- 关注
RSS订阅原创 《富爸爸穷爸爸》阅读心得
请用理性看待本书！本书的作者是罗伯特·清崎，他的亲生父亲是一位受过良好教育、有着博士头衔的教师，被称为“穷爸爸”；罗伯特儿时玩伴迈克的父亲是当时夏威夷最富有的人之一，也是对罗伯特人生产生巨大影响的人，被他称为“富爸爸”。两位爸爸对财富的不同理解，让他们在生活、经济及事业上都产生了截然不同的结果。罗伯特正是在这两种截然不同观念的影响下，学习并洞穿了理财的本质，为他和他的家人积累了大量的财富，并把这个过程写在了本书中。众所周知，思想控制行为、行为造就结果。
2023-07-27 19:11:13
204
原创 Git 命令正、逆向实用操作
工作区与缓存区之间操作：正向git add <FileName>将单个文件添加至缓存区git add .将多个文件添加至缓存区逆向git reset HEAD <FileName>把放进缓存区的单个文件撤销，工作区文件不受影响git reset HEAD .把放进缓存区的多个文件撤销，工作区文件不受影响git checkout --<FileName>把本地区的单个文件撤销，并替换为缓存区版本git checkout -- . ...
2020-10-24 17:48:23
935
原创 react系列（23）懒加载的应用
在使用Create React App创建的React项目，通常会通过import引用所需的组件(如import HelloWorld from './HelloWorld')，当项目打包成生产环境代码时，通过这种方式引用的js文件都会被打包到一起。当前端项目代码量足够大时，这意味最终打包出来的index.js代码量也将会非常大，这明显不利于实现页面的秒加载。遇到这种场景，懒加载就提供了解决方案。...
2020-03-10 17:12:19
453
原创 高级前端软件工程师知识整理之Vue技术栈篇
1.什么是MVVM？MVVM是Model-View-ViewModel的简写，它本质上就是MVC的改进版。MVVM就是将View的状态和行为抽象化，将视图UI和业务逻辑分开，View和Model之间并没有直接的联系，而是通过ViewModel进行交互，它们之间的交互是双向的。Model -代表数据模型，定义了视图的状态或行为。 View -代表视图，负责将数据模型转化成可视化界...
2019-04-19 05:02:32
4961
1
原创 高级前端软件工程师知识整理之React技术栈篇
1.介绍一下JSX？JSX是一种JavaScript的语法扩展，运用于React架构中用来描述用户界面。在这种语法环境下，用大括号表示JSX表达式，表达式里可以是声明的变量、函数。引用样式时，属性名称class要改成className，如：var myDivElement = <div className="foo" />;ReactDOM.render(myDivEle...
2019-04-18 05:54:07
2011
原创 高级前端软件工程师知识整理之打包篇
1.简单介绍一下webpack有哪些配置？以目前最新版本4.29.6为例，webpack的基本配置包括：配置 描述 context 基础目录，绝对路径，用于从配置中解析入口起点entry和loader entry 起点或是应用程序的起点入口。从这个起点开始，应用程序启动执行。如果传递一个数组，那么数组的每一项都会执行。...
2019-04-13 12:33:19
985
原创 高级前端软件工程师知识整理之安全篇
1. CSRF跨域攻击的安全性问题怎么防范？CSRF（Cross Site Request Forgery, 跨站域请求伪造）是一种网络的攻击方式，可以在受害者毫不知情的情况下以受害者名义伪造请求发送给受攻击站点，从而在并未授权的情况下执行在权限保护之下的操作。被攻击的站点通常是只通过cookie手段来验证用户操作的有效性。被攻击过程如下：从上图可以看出，要完成一次CSRF攻击，受害者...
2019-04-12 04:59:31
405
原创 高级前端软件工程师知识整理之异步篇
1. 介绍 Promise函数，它的内部实现是什么？Promise 是异步编程的一种解决方案，比传统的解决方案回调函数CallBack更合理，。Promise对象有三种状态：pending（进行中）、fulfilled（已成功）和rejected（已失败）。一旦状态确定就无法改变，Promise对象的状态改变，只有两种可能：从pending变为fulfilled和从pending变为rejec...
2019-04-11 03:20:17
441
原创 高级前端软件工程师知识整理之跨域篇
1.ajax如何处理跨域？ajax使用jsonp请求实现跨域，关于这个网上已经很多资料了，基本用法这里就不介绍了。其原理可以参考我的另一篇文章《18~19年大厂高级前端面招汇总之基础篇(一)》中的【3.jsonp实现的原理是什么？】,但如果继续深究，很少资料能介绍清楚其参数jsonp和jsonpCallback的区别，以及jsonpCallback的回调函数与success的回调函数的区别...
2019-04-10 04:00:42
366
原创 高级前端软件工程师知识整理之样式篇
1.请介绍flex布局？flex布局也称为弹性布局，是现下最常用的布局方式。要用好flex布局，就必须了解好其主轴、从轴的概念及各种对齐方式。详细介绍及用法请看我写的另一篇文章《重新认识 WEB 开发与 RN 开发中 position、display 样式的用法及差异》中的display部分。2.css如何实现垂直居中？这是前端中经典的面试题。css实现垂直居中的方法有很多，这里介...
2019-04-09 08:40:52
341
原创 高级前端软件工程师知识整理之基础篇(四)
21. JS里垃圾回收机制是什么？常用方法有哪些以及如何优化垃圾回收？由于字符串、对象和数组没有固定大小，所以当他们的大小已知时，才能对他们进行动态的存储分配。JavaScript程序每次创建字符串、数组或对象时，解释器都必须分配内存来存储那个实体。只要像这样动态地分配了内存，最终都要释放这些内存以便他们能够被再用，否则，JavaScript的解释器将会消耗完系统中所有可用的内存，造成系统崩溃...
2019-04-09 02:48:09
548
原创 高级前端软件工程师知识整理之基础篇(三)
11.介绍一下sessionStorage 、localStorage 和 cookie 之间的区别？cookie和token作为验证手段又有什么区别？sessionStorage 、localStorage 和 cookie都保存在浏览器端，它们的区别是：sessionStorage：作为临时数据存储，在不同的浏览器窗口里并不共享，当关闭浏览器后将会被自动删除。 localStor...
2019-04-06 07:27:52
1305
1
原创 高级前端软件工程师知识整理之基础篇(二)
6.怎么实现对象的深拷贝和浅拷贝？对象属于引用类型，保存在堆内存中。浅拷贝是指简单的赋值，实际上只是复制该对象指向的指针地址而已，两个变量最终都指向同一个对象。因此一个对象改变时，另一个对象也会跟着改变。var obj = { name: 'John', age: 30}var obj2 = obj;obj2.sex = 'man';console.log(obj); //...
2019-04-05 02:56:29
457
原创 高级前端软件工程师知识整理之基础篇(一)
1.说出几点前端优化的方法？（1）减少网络请求次数。优化情形：客户端向服务端请求大量资源，如图片、js文件等。网络请求遵循HTTP协议，每一次请求都是与服务端的独立通信，在建立通信过程需要时间，如果请求次数过多会造成页面反应迟钝，遇到这种情形，可以将资源文件合并压缩成一个文件来加载，通过实现减少与服务端资源请求次数达到优化效果。（2）数据增量加载。优化情形：客户端向服务端API接口请求大...
2019-04-04 06:46:57
732
原创 《让大象飞》阅读心得
该书作者是史蒂文·霍夫曼，硅谷重量级创业教父、天使投资人、演讲人，《福布斯》杂志排名第一的创业孵化器Founders Space创始人，人称 “霍夫曼船长”。个人建议正在创业或将要创业的人都必须看看这本书，全书给我的感觉是满满的干货和作者的诚意，它更是一本创业“实践手册”。该书可以分为六个部分解读：定方向、建团队、做精品、抓用户、持续创新、高速运转。这也是创业过程中必须经历的...
2019-03-29 04:44:08
1206
原创 《用事实说话》阅读心得
本书的作者是马克·墨菲，书中通过了许多例子来详细地阐述了为什么忠言逆耳、为什么在沟通中会情绪化以及如何聚焦事实更好地解决问题。本书教会了我两点：如何利用FIRE模型认清事实 如何管理好自己的情绪并站在不同的角度看待并解决问题在职场工作中，我们都曾在沟通中责难过别人或者被别人责难，这时候往往会带有情绪上头、心情低落或内心抵触等心理活动，等到沟通结束却忘记了最初沟通的目的是...
2019-03-26 03:49:14
10299
原创 react-native系列(25)API补充篇：活动状态+设备返回键与振动+计时器+剪切板相关功能
AppState应用状态AppState用于检测当前APP应用是否在活动中。可以通过属性currentState获取：AppState.currentState如果间监听活动状态，可以使用：state = { appState: AppState.currentState}componentDidMount() { AppState.addEventLis...
2019-03-15 17:32:45
470
原创 react-native系列(24)API篇：屏幕宽高和屏幕像素密度
Dimensions屏幕宽高Dimensions库可以获取屏幕的宽高：import { Dimensions } from 'react-native';const {height, width} = Dimensions.get('window'); // 可用显示屏幕的宽高，不包括顶部的状态信息栏const {height, width} = Dimensions.get('s...
2019-03-15 14:40:53
1023
原创 react-native系列(23)API篇：使用Linking唤醒其它app及WebView
RN官方提供Linking库用于调起其他app或者本机应用。Linking的主要属性和方法有：属性与方法 描述 canOpenURL(url); 判断设备上是否有已经安装相应应用或可以处理URL的程序，本方法会返回一个Promise对象，只有一个回调参数，格式为Boolean值。 openURL(url); 打开设备上的某个应用或可以处理URL的程序，本方法会返回一个...
2019-03-14 16:38:15
6958
1
原创 react-native系列(22)API篇：网络状态NetInfo与网络请求Fetch详解
网络状态NetInfoNetInfo库的作用是检测当前是否联网及获取联网方式及网络牌照等信息。要使用NetInfo库，需要先在AndroidManifest.xml中配置权限：<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />要检测网络是否在线可以使用：NetInf...
2019-03-13 16:02:22
3088
1
原创 react-native系列(21)API篇：手势PanResponder详解
PanResponder库用于处理用户的手势操作，如单点触摸滑屏、多点触摸放大缩小等手势。PanResponder的创建代码如下：this._panResponder = PanResponder.create({ // 返回ture时，表示该组件愿意成为触摸事件的响应者，如触摸点击。默认返回false。 onStartShouldSetPanResponder: () ...
2019-03-13 14:35:08
2923
原创 react-native系列(20)API篇：照片或视频的获取、保存、选择与上传
照片获取与保存官方提供了CameraRoll模块访问本地相册的功能，它包含两个方法：方法 描述 CameraRoll.getPhotos(params); 表示获取相册数据，参数格式如下： { first：number类型，要获取的照片数 assetType：All |Videos |Photos，默认为Photo...
2019-03-12 16:23:49
4419
1
原创 react-native系列(19)API篇：请求系统权限(相册等)
在旧版本，要获取设备权限（如读写权限等）直接在项目中配置即可，无需过问app用户。在新版本的API中，出于安全考虑，要获取设备的相应权限需要通过权限请求，用户通过之后才可以获取权限，android和ios的获取权限方式不同。android权限官方提供了PermissionsAndroid来获取权限，以获取WRITE权限为例，看如下代码：UNSAFE_componentWillMoun...
2019-03-12 09:29:53
6648
原创 react-native系列(18)API篇：AsyncStorage数据持久化
数据持久化是指使用AsyncStorage模块存储了数据后，即使关闭了app，只要下次打开依然可以读取到已存储的数据，它包含4个操作：存储、获取、移除和合并，存储数据的方式是Map存储，即(key, value)。另外，无论是key还是value都只支持字符串格式，其它格式将会报错（如果要存储对象格式的数据，可以通过JSON.stringify先把对象转化为字符串格式）。单一数据操作封装好...
2019-03-11 16:18:05
1953
1
原创 react-native系列(17)API篇：Platform平台差异化加载
Platform模块用于区分移动设备的操作系统及api版本，另外，还可以根据不同平台的后缀扩展名自动识别并装载组件。系统区分要检测当前设备是什么操作系统，可以使用：const os = Platform.OS; // android|ios 要获取版本，可以使用：const version = Platform.Version;后缀扩展名当不同平台的代码逻辑较为复杂...
2019-03-10 22:26:16
3385
原创 react-native系列(16)组件补充篇：加载符号、范围选择、开关、状态栏
这些都是一些官方组件，由于样式上并不能完全自定义，一般不会直接用于实际项目中，但可以作为设计属性和结构组件时的一个参考例子，如入参的设计。ActivityIndicator显示一个圆形的加载中提示符号。ActivityIndicator在实际应用中一般为绝对布局，居中显示。属性 描述 style 用于设置布局类型 animating ...
2019-03-09 23:48:29
625
原创 react-native系列(15)导航篇：底部导航TabNavigator参数及使用详解
本篇主要介绍的是TabNavigator，假设你已经对它的用法已经有了基本的认识，或重新去官网看一下官网地址：https://reactnavigation.org/zh-Hans/底部导航TabNavigator的效果类似于微信，效果图：TabNavigator生成的底部导航的结构，它包括4部分：选项卡栏 选项卡 图标 标签文本createBottomTabNav...
2019-03-09 02:25:06
2915
原创 react-native系列(14)导航篇：页面导航StackNavigator参数及使用详解
react-navigation导航是RN官网推荐使用的导航插件，目前最新版本为3.x，它包括3种类型的导航：StackNavigator TabNavigator DrawerNavigator本篇主要介绍的是StackNavigator，假设你已经对它的用法已经有了基本的认识，或重新去官网看一下官网地址：https://reactnavigation.org/zh-Hans/...
2019-03-08 23:16:35
3015
原创 react-native系列(13)动画篇：Animated动画库和LayoutAnimation布局动画详解
动画概念了解流畅、有意义的动画对于APP户体验来说是非常重要的，用RN开发实现动画有三种方法：requestAnimationFrame：称为帧动画，原理是通过同步浏览器的刷新频率不断重新渲染界面实现动画效果，现在网页H5动画基本都由这种实现。帧动画最初是Flash用于实现网页动画和游戏，即AS3编程。由于H5实现对动画更优的支持及Adobe对Flash的停止维护，这种编程现在基本已经被取...
2019-03-06 09:23:40
4883
1
原创 react-native系列(12)图标篇：使用阿里字体库iconfont图标和svg详解
在前端开发中，经常会用到iconfont图标库来管理图标，在RN开发中有时候同样需要如此。在百度上搜索过RN相关的图标管理方案，发现都较为复杂。于是写下了本篇博客，为大家介绍另外两种更优化的图标应用的方案，供大家学习参考。iconfont图标该方案同样适用于字体变更。从iconfont库下载好图标脚本，结构如下：打开iconfont.ttf文件，我们看一下字体全称是什么？正常情况下...
2019-03-05 05:20:15
7037
1
原创 react-native系列(11)组件篇：Image图片加载和ImageEditor图片剪切
Image图片加载在RN中，用Image标签来渲染图片，图片的来源有两种：本地静态图片和网络图片(或Base64格式数据，如手机相册)，针对不同的方式有不同的数据源写法，它们之间的区别如下：// 渲染本地静态图片<Image source={require('../../assets/images/watch.jpg')} />// 渲染网络图片<Image so...
2019-03-04 23:23:58
4233
1
原创 react-native系列(10)组件篇：Modal模态框实现弹窗效果
模态框应用于界面弹窗，为用户提供通知、选择、浏览等功能的组件。在RN中，模态框通过Moadl标签引用。使用时注意，可以把Modal看成一个仅提供功能的外壳，它不包含任何样式，只负责显示/隐藏和动画效果实现。Modal的子组件通常为一个View容器，在该View容器实现渲染界面和样式相关。在很多APP应用模态框的时候，出于视觉的优化，Modal子组件最外层的View容器为一层占满全屏的半透明背景层。...
2019-03-02 01:16:31
6618
原创 react-native系列(9)组件篇：最优列表显示方案FlatList和SectionList
FlatList列表FlatList是一个高性能的列表组件。原理是：只负责渲染当前可见的列表项，对于不可见的项将不会渲染因为可见的项总是有限的，当一个项被划出屏幕后，被滑出项的容器将会成为新滑入的项的容器而不会重新再渲染一个，因此性能要比ScrollView和ListView组件高。下面是一个原理简图：FlatList的属性和方法：属性 描述 style ...
2019-03-01 04:20:02
3801
1
原创 《从0到1 开启商业与未来的秘密》阅读心得
该书作者为彼得蒂尔(美国Paypal创始人)，主要讲述了一些人们对市场的认知及初创企业的心得。认知认知1：水平进步和垂直进步水平进步：照搬已取得的经验或成果，从1跨越到n，概括为“复制”，如全球化。 垂直进步：探索新的道路，从0跨越到1，概括为“创新”，如科技。从积极的角度来说，一家初创公司应该尽可能的往垂直进步的方向去努力。认知2：完全竞争和垄断完全竞争：处于市场竞争中的...
2019-02-28 06:18:02
1303
原创 react-native系列(8)组件篇：Touchable实现按钮的点击触摸效果
在RN中并没有onclick监听，想要在组件中注册点击事件，需要使用Touchable。该组件也可以理解为一个Animated.View容器，然后把需要注册点击事件的组件作为子组件，并注册onPress函数实现点击效果。Touchable目前有三种效果：TouchableHighlight：点击时显示高亮效果 TouchableOpacity：点击时显示半透明效果 TouchableW...
2019-02-28 05:55:25
3169
原创 react-native系列(7)组件篇：TextInput输入文本框的双向绑定
文本输入框是APP中最常用的交互组件，在RN中用TextInput标签表示。使用时要注意，它依然遵循双向绑定的规则，通过定义一个state状态值赋值至输入文本框的value属性中，同时组件监听onChangeText事件来获取输入文本的变化，将变化结果传递给state状态值，从而实现双向绑定。TextInput的属性与方法属性 描述 style 显示的样式...
2019-02-28 00:53:51
3598
Node.js Express框架GET、POST、COOKIE、上传、数据库等测试实例
2018-01-26
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人