- 博客(34)
- 收藏
- 关注
原创 整洁的javascript代码
变量1.使用直观且有意义的变量名Bad:const yyyymmdstr = moment().format("YYYY/MM/DD");Good:const currentDate = moment().format("YYYY/MM/DD");2.对相同类型的变量使用相同的词汇Bad:getUserInfo();getClientData();getCustomerRe...
2020-02-13 15:04:35
257
原创 JavaScript权威指南之函数
闭包词法作用域:函数的执行依赖于作用域,这个作用域是在函数定义时决定的,而不是在函数调用时决定的。定义:当调用函数时的作用域和定义函数时的作用域不是同个作用域,就叫闭包。var scoped = 'global scoped';function getScoped () { var scoped = 'local scoped'; function func () { return...
2020-01-07 07:38:57
251
原创 JavaScript权威指南之数组
创建数组1.数组字面量var arr = [1,2,3];2.使用构造函数Array(创建的数组是稀疏数组,后面解释)var arr = new Array(10);数组元素的读和写1.数组是属于特殊对象。2.如果属性是数组的索引,那么数组将会更新其length。3.如果使用非数字或者负数来索引数组,那么数值会转换为非数组索引,当做常规对象的属性。4.数组的索引属于对象属性名...
2019-12-28 11:06:28
201
原创 Javascript权威指南之类型、变量和表达式
整型直接量在ES6的严格模式下,八进制是被严格禁止的。在之前的版本虽然不支持,但是javascript的某些实现使得可以使用八进制数作为整型数。算术运算Number.POSITIVE_INFINITY === Infinity; //tueNumber.NEGATIVE_INFINITY === -Infinity; //tueisFinite()在Infinity、-Infini...
2019-12-27 23:10:45
149
原创 JavaScript权威指南之对象
创建对象1.对象直接量var obj = { name: 'xiaoming', age: 20};2.关键字newvar obj = new Object();3.Object.create函数var obj = Object.create(Object.prototype);实现原理:/**@params {object} p@returns {object}...
2019-12-27 13:14:10
105
原创 vue绑定key的案例(输入框失焦问题)
之前做过这样的一个需求,就是输入框可动态增加或者减少的场景。通过v-for来遍历所有输入框,那么分析下面key几种情况:为了演示,这里假设输入框的校验规则是允许字符数为1-5。1.没有绑定key 或者 key绑定index的情况如图所示,第二个输入框输入了6个字符,校验不通过,但是第三个输入框校验是通过的,但是当我们删除第二个输入框的时候,第三个输入框变为第二个输入框,本来校验通过的,现在反...
2019-12-14 16:59:30
1721
原创 慕课网react开发简书网站项目中涉及的基础知识点
react项目地址:https://github.com/suhuashan/jianshu,该项目是学习慕课网react视频教程而手动敲,目前项目是用class写react,后续我会引用react hooks会重构项目。如果对您有帮助的话,麻烦在github给个star~
2019-12-08 22:34:02
555
原创 实习感想
自从3月底去sangfor实习,到现在一直没更新博客。实习期间学了很多东西,但是没有输出成文章,很容易就被把识点遗忘,接下来争取一周更新一篇博客,在此立下flag。因为工作中使用的前端框架是vue,所以接下来会分享一些vue使用过程中遇到的坑和部分源码解读。...
2019-12-08 22:16:17
106
原创 Less使用教程(容易入门)
Less语法详解1.注释//单行注释/*多行注释多行注释多行注释*/2.变量@color: red;@size: 14px;.container{ background: @color; font-size: @size;}编译后的css代码.container { background: red; font-size: 14px;}3.混合第一种...
2019-03-23 17:46:00
5681
4
原创 慕课网vuejs开发饿了么APP的知识总结
视频里面使用的vue1.0开发,我使用vue2.x进行修改,并且对部分代码抽离为独立的组件。项目源代码地址:https://github.com/suhuashan/elm-vue项目浏览:关于项目打包(npm run build),有几个坑需要了解一下~~~1.将打包生成的dist文件放在本地或者是服务器,都会出现页面404,访问不到资源的问题,因为是路径问题。解...
2019-03-19 12:52:26
1855
2
转载 webpack打包优化的完美解决方案
webpack打包优化分为两部分,一部分是大小优化,另一部分是速度优化。大小优化1.CommonsChunk前端构建项目中,为了提高打包效率,往往将第三库与业务逻辑代码分开打包,因为第三方库往往不需要经常打包更新。webpack建议使用CommonsChunk 来单独打包第三方库:module.exports = { entry: { vendor: ['rea...
2019-03-16 15:37:20
26719
原创 单行文本超出或多行文本超出显示省略号...
单行文本超出隐藏css样式中必须同时设置:white-space: nowrap; //不换行text-overflow: ellipsis;overflow: hidden; <h3>单行文本超出隐藏</h3> <div class="single"> This is a sad story. Tell me...
2019-03-15 14:45:50
1168
转载 前端面试之webpack面试常见问题
1:什么是webpack和grunt和gulp有什么不同答案:Webpack是一个模块打包器,他可以递归的打包项目中的所有模块,最终生成几个打包后的文件。他和其他的工具最大的不同在于他支持code-splitting、模块化(AMD,ESM,CommonJs)、全局分析。2:什么是bundle,什么是chunk,什么是module?答案:bundle是由webpack打包出来的文件,c...
2019-03-14 16:18:17
513
转载 前端面试考点多?看这些文章就够了
金三银四跳槽季,offer快到碗里来,前端面试考点众多,而网上各个知识点的博客文章又太多,看的眼花缭乱……所以便整理了一下常见知识点的精华文章,每个知识点的文章控制在3篇以内,尽量覆盖该知识点的下容易被面试到的所有内容,文章都是之前自己读过的,确定是精华干货。文章会一直更新,也欢迎大家推荐精华文章,大家共同学习进步!CSScss布局干货!各种常见布局实现+知名网站实例分析BFC学习 B...
2019-03-12 20:54:41
260
原创 瀑布流页面实现(jQuery自定义插件)
代码github地址:https://github.com/suhuashan/waterfall如果觉得对你有帮助,请赐我star~~解决思路:第一行的子元素进行单独定位。第二行开始,开始比较每一列的高度,然后在最小的高度的那一列加上一个子元素。这时,记得同时更新该列的高度。最后,一直循环这个过程即可。...
2019-01-21 23:44:21
190
原创 npm包分类管理与分类恢复
1.npm包介绍在npm引用的依赖的时候,会在项目的根目录生成node_modules文件夹和package.json文件。依赖文件包存放在node_modules中,package.json记录的是开发环境和生产环境的依赖名字。这样有利于在某个包丢失的时候,可以针对哪个环境下进行恢复。2.包分类管理安装包的时候,做一个分类管理:开发环境 npm 包名 -D —> devDe...
2019-01-21 19:07:43
761
原创 webpack的详细配置与使用
版本说明webpack版本: “webpack”: “^3.6.0”例子:该实例代码可参见github地址:创建目录aaa先初始化npm init并创建以下几个文件:index.htmlmain.jscal.js&lt;!---index.html文件--&gt;&lt;!DOCTYPE html&gt;&lt;html lang="en"
2019-01-21 18:57:10
751
原创 Error: EBUSY: resource busy or locked, symlink 的解决办法
当npm intsall或者是cnpm install拉取依赖时,出现以上错误。解决方案:关闭电脑的杀毒软件即可。
2019-01-21 12:34:15
15236
6
原创 JavaScript系列之四:模块化开发
模块化如果不用模块化编写代码,那么会具有以下问题:代码杂乱无章,没有条理性,不便于维护,不便于复用全局变量污染不方便保护私有数据模块化的基本实现:闭包的自调用函数 var DatePicker = (function(){ return { init(){ } } }){}AMD模块...
2019-01-13 14:59:34
177
原创 JavaScript系列之三:正则表达式
正则表达式学习网站https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/RegExp概念正则表达式是为了解决字符串操作中一些比较麻烦的场景,比如字符串提取、字符串替换、字符串验证等常用于:表单验证:是否是一个数字、是一个电话号码、是一个邮箱。。。字符串替换:创建一个正...
2019-01-13 14:54:40
129
原创 JavaScript系列之二:继承、作用域、闭包
继承JS中继承的概念:通过【某种方式】让一个对象可以访问到另一个对象中的属性和方法,我们把这种方式称之为继承 并不是所谓的xxx extends yyy为什么要使用继承?有些对象会有方法(动作、行为),而这些方法都是函数,如果把这些方法和函数都放在构造函数中声明就会导致内存的浪费 function Person(){ this.say=function()...
2019-01-13 14:41:03
417
原创 JavaScript系列之一:面向对象编程
JS基本介绍JS的用途:Javascript可以实现浏览器端、服务器端(nodejs)。。。浏览器端JS由以下三个部分组成:ECMAScript:基础语法(数据类型、运算符、函数。。。)BOM(浏览器对象模型):window、location、history、navigator。。。DOM(文档对象模型):div、p、span。。。ECMAScript又名es,有以下重大版本:...
2019-01-13 14:39:23
124
原创 CSS3【控制样式,网页布局】
CSS3中新特性样式篇背景background-origin: 规定背景图片的定位区域。 ☞ padding-box 背景图像相对内边距定位(默认值) ☞ border-box 背景图像相对边框定位【以边框左上角为参照进行位置设置】 ☞ content-box 背景图像相对内容区域定位【以内容区域左上角为参照进行位置设置】 备注: 1. 默认盒子的背景图片是...
2019-01-13 14:12:16
344
原创 HTML5基础
了解HTML5 ☞HTML5属于上一代HTML的新迭代语言,设计HTML5最主要的目的是为了在移动设备上支持多媒体!!! 例如: video 标签和 audio 及 canvas 标记 ☞ 新特性: 1. 取消了过时的显示效果标记 &lt;font&gt;&lt;/font&gt; 和 &lt;center&gt;&lt;/center&gt; ..
2019-01-13 14:08:43
171
转载 Javascript面向对象编程(三):非构造函数的继承
该系列文章有三篇,本篇属于第三篇。第一篇:Javascript 面向对象编程(一):封装第二篇:Javascript面向对象编程(二):构造函数的继承文章是引用阮一峰老师的,但里面细节结合了自己一部分的思考。一、什么是"非构造函数"的继承?比如,现在有一个对象,叫做"中国人"。var Chinese = { nation:'中国'};还有一个对象,叫做"医生"。var Do...
2019-01-12 14:51:04
99
转载 Javascript 面向对象编程(一):封装
Javascript是一种基于对象(object-based)的语言,你遇到的所有东西几乎都是对象。但是,它又不是一种真正的面向对象编程(OOP)语言,因为它的语法中没有class(类)。那么,如果我们要把"属性"(property)和"方法"(method),封装成一个对象,甚至要从原型对象生成一个实例对象,我们应该怎么做呢?一、 生成实例对象的原始模式假定我们把猫看成一个对象,它有"名字...
2019-01-12 14:26:22
130
原创 JavaScript创建自定义类型的方法(组合使用构造函数模式和原型模式)
创建自定义类型的最常见方式,就是组合使用构造函数模式和原型模式。构造函数模式用于定义实例属性,而原型属性用于定义方法和共享的属性。结果,每个实例都会有自己的一份实例属性的副本,但同时又共享着对方法的引用,最大限度地节省了内存。这种混成模式还支持向构造函数传递参数;可谓是集两种模式之长。function Person(name,age,job) { this.name = name; th...
2019-01-12 14:23:33
234
转载 Javascript面向对象编程(二):构造函数的继承
先定义两个对象:定义一个“动物”对象function Animal(species){ this.species = &quot;动物&quot;; this.eat = function() { console.log(&quot;吃东西&quot;);}再定义一个“猫”对象function Cat(name,color) { this.name = name; this.color = colo
2019-01-12 13:13:05
124
原创 前端模块化:CommonJS,AMD,CMD,ES6
一、模块化开发为什么要模块化开发呢?其一,解决模块中函数名重复的问题;其二,解决模块之间的依赖关系。目前流行的js模块化规范有CommonJS、AMD、CMD以及ES6的模块系统。具体可以参考阮一峰老师的文章:module-loader二、CommonJSNode.js是commonJS规范的主要实践者,它有四个重要的环境变量为模块化的实现提供支持:module、exports、req...
2019-01-03 12:29:05
125
原创 ES6实用教程
一、ES6的概念ES6是 新一代的JS语言标准,包含ES2015、ES2016、ES2017、ES2018等。ES2015特指在2015年发布的新一代JS语言标准,现阶段在绝大部分情景下,ES2015默认为ES6。ES2015可以理解为ES5和ES6的时间分界线。二、变量声明ES5里面var没有块级作用域,这样一来,会导致很多问题。例如for循环变量泄露,变量覆盖,变量提升等问题。ES6用...
2019-01-01 23:37:04
3436
原创 微信小程序从本地开发环境到线上测试环境和生产环境的配置
这篇文章是对慕课网mpvue实战项目视频过程中环境的配置的总结与更新(因为小程序文档时不时就更新)项目源码:https://github.com/suhuashan/bookCommentSystem如果对你有帮助,请赐给我star~. 视频如果需要可以私信我。开发环境分为本地开发环境和线上开发环境。为什么要在本地环境开发呢?其实也就是便于调试。线上开发环境每次都得上...
2018-12-06 22:06:10
18612
3
原创 Git常用指令
Git常用命令1.git initgit init //初始当前目录,生成.git文件夹2.git statusgit status //查看当前本地分支下有没有文件被修改或者有没有新增文件3.git clonegit clone <版本库的网址> git clone <版本库的网址> <本地目录名> //...
2018-12-04 21:31:40
160
原创 vue项目下,用命令直接修复ESLint报错
在写mpvue(小程序框架,其实也算是vue项目)项目过程引入ESLint代码规范,出现很多规范问题。首先在项目的根目录下找到package.json文件,找到下面的位置,也就是“lint”这一条指令,指令后面具体内容不用深究。然后修改成:接下来,运行npm run lint可以自动解决绝大多数错误,应该有可能包含一些错误只能手动解决的。例如,我运行后,还剩下一个错误:...
2018-11-29 23:11:10
5619
原创 ajax跨域请求以及传递cookie
声明: 本文章是自己在开发过程遇到问题的经验总结以及结合其他文章的解决思路。一、ajax跨域访问什么是跨域?这是因为浏览器的同源策略会导致跨域,只要协议,域名,端口有任何一个不同,都被当作是不同的域,之间的请求便为跨域操作。跨域访问一般是被阻止的,因为在安全上有个规则:同源策略要求客户端和服务端都必须在一个域内才能通信。比如网站A为a.test.com,网站B为b.test.com。...
2018-08-25 15:49:33
4620
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人