javascript
前端优选
这个作者很懒,什么都没留下…
展开
-
2020年你必须要会的微前端 -(实战篇)
戳蓝字"前端优选"关注我们哦!最近你有没有经常听到一个词,微前端?是不是听上去感觉非常地高大上!然而~微前端其实非常地简单,非常地容易落地,而且也非常不高大上~那么就来一...原创 2020-07-26 12:00:00 · 30963 阅读 · 4 评论 -
Vue核心概念及特性 (一)
Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架。特点: 易用,灵活,高效,渐进式框架。可以随意组合需要用到的模块 vue components vue-router vuex vue-cli一.Vue的概念和特性1.什么是库,什么是框架?库是将代码集合成一个产品,我们可以调用库中的方法实现自己的功能。框架则是...原创 2019-10-18 22:23:42 · 5136 阅读 · 0 评论 -
快速进阶Vue3.0
在2019.10.5日发布了Vue3.0预览版源码,但是预计最早需要等到 2020 年第一季度才有可能发布 3.0 正式版。可以直接看 github源码。新版Vue 3.0计划并已实现的主要架构改进和新功能:编译器(Compiler)使用模块化架构优化 "Block tree"更激进的 static tree hoisting 功能 (检测静态语法,进行提升)支持 Source ...原创 2019-10-16 17:19:29 · 1259 阅读 · 0 评论 -
从0搭建自己的webpack开发环境(五)
往期回顾:从0搭建自己的webpack开发环境(一)从0搭建自己的webpack开发环境(二)从0搭建自己的webpack开发环境(三)从0搭建自己的webpack开发环境(四)前四篇文章我们已经掌握了webpack各种常见的配置,这一片文章我们来看看如何实现webpack中的优化。我们先来编写最基本的webpack配置,然后依次实现其中的各种优化。const MiniCssExtr...原创 2019-09-20 23:30:15 · 252 阅读 · 0 评论 -
从0搭建自己的webpack开发环境(四)
往期回顾:从0搭建自己的webpack开发环境(一)从0搭建自己的webpack开发环境(二)从0搭建自己的webpack开发环境(三)经过三期的学习,本篇文章将介绍TS和React/Vue的结合使用,搭载Webpack,助力成长前端高级技术体系。下面继续一起学习:1.配置TS环境1.1 使用ts-loader使用typescript需要安装ts相关配置npm install ty...原创 2019-09-19 21:54:56 · 125 阅读 · 0 评论 -
从0搭建自己的webpack开发环境(三)
往期回顾:从0搭建自己的webpack开发环境(一)从0搭建自己的webpack开发环境(二)1.处理JS模块1.1 将es6代码编译成es5代码代码的转化工作要交给babel来处理npm install @babel/core @babel/preset-env babel-loader --save-dev@babel/core是babel中的核心模块,@babel/prese...原创 2019-09-18 17:33:05 · 157 阅读 · 0 评论 -
从0搭建自己的webpack开发环境(二)
上期回顾:从0搭建自己的webpack开发环境(一)loader主要是用于把模块原内容按照需求转换成新内容,以便用来加载非 JS 模块!通过使用不同的loader,Webpack可以把不同的文件都转成JS文件,比如CSS、ES6/7、JSX等。让我们来看看这些必须要掌握的loader!1.loader的编写1.1 loader的使用test:匹配处理文件的扩展名的正则表达式us...原创 2019-09-17 22:38:19 · 237 阅读 · 1 评论 -
从0搭建自己的webpack开发环境(一)
上期文章:前端自动化测试又一个连载来啦!这次我们将分四篇文章来介绍如何从0构建一个webpack开发环境,了解其内部机制和原理,从而让我们更准确的掌握和使用webpack,下面开始我们的起步:1.什么是Webpack?webpack是一个现代 JavaScript 应用程序的静态模块打包器(module bundler),当 webpack 处理应用程序时,它会递归地构建一个依赖关系图(de...原创 2019-09-16 17:08:59 · 332 阅读 · 0 评论 -
前端自动化测试(四)
在Vue项目中测试组件时会引用全局组件,那么如何处理这些全局组件呢? 还有Vue中比较重要的一个点就是Vuex如何进行测试?1.测试时使用VueRouter1.1 存根在你的组件中引用了全局组件 router-link 或者 router-view组件时,我们使用shallowMount来渲染时会提示无法找到这两个组件,我们可以使用存根的方式mock掉相关的组件。<template&...原创 2019-09-12 19:13:47 · 282 阅读 · 0 评论 -
前端自动化测试(三)
前端自动化测试(一)前端自动化测试(二)通过前两篇文章的学习,我相信大家对Jest的核心用法可以说是已经掌握了,这一篇文中我们在Vue中使用Jest1.Vue中集成Jest我们可以通过vue官方提供的@vue/cli 直接创建Vue项目,在创建前需要先安装好@vue/cli~这里直接创建项目:vue create vue-unit-project? Please pick a p...原创 2019-09-11 18:25:19 · 357 阅读 · 0 评论 -
前端自动化测试(二)
上一篇文章,我们已经讲述了Jest中的基本使用,这一篇我们来说说如何深度使用Jest在测试中我们会遇到很多问题,像如何测试异步逻辑,如何mock接口数据等…通过这一篇文章,可以让你在开发中对Jest的应用游刃有余,让我们逐一击破各个疑惑吧!1.Jest进阶使用1.1 异步函数的测试提到异步无非就两种情况,一种是回调函数的方式,另一种就是现在流行的promise方式export cons...原创 2019-09-10 16:59:09 · 646 阅读 · 0 评论 -
前端自动化测试(一)
目前开发大型应用,测试是一个非常重要的环节,但是大多数前端开发者对测试相关的知识是比较缺乏的。因为可能项目开发周期短根本没有机会写,所以你没有办法体会到前端自动化测试的重要性。来说说为什么前端自动化测试如此重要!先看看前端常见的问题:修改某个模块功能时,其它模块也受影响,很难快速定位bug多人开发代码越来越难以维护不方便迭代,代码无法重构代码质量差增加自动化测试后:我们为核心...原创 2019-09-09 17:11:57 · 4442 阅读 · 0 评论 -
new原理及模拟实现
简介newnew 运算符是创建一个用户定义的对象类型的实例或具有构造函数的内置对象的实例,其创建过程如下:创建一个空的简单JavaScript对象(即{})链接该对象(即设置该对象的构造函数)到另一个对象将第一步新创建的对象作为this的上下文如果该函数没有返回对象,则返回this举个栗子:function Person(name,age){ this.name = na...原创 2019-09-06 16:17:25 · 632 阅读 · 0 评论 -
从原型到原型链
构造函数function Animal() {}var cat = new Animal();cat.name = 'Tom';console.log(cat.name) // Tomprototype每个函数都有一个 prototype 属性函数的 prototype 属性指向了一个对象,这个对象正是调用该构造函数而创建的实例的原型,也就是这个例子中的cat和dog的原型。...原创 2019-09-05 00:52:15 · 132 阅读 · 0 评论