如何写好一个vue组件,老夫的一年经验全在这了；【前端面试分享】- 寒冬求职上篇；七个 JavaScript 技巧；vue组件间通信六种方式（完整版）；JS是世界上最好的语言—— 使用Electron开发桌面应用(一)；一张思维导图辅助你深入了解 Vue | Vue-Router | Vuex 源码架构；前端密码加密的几种方式整理；你所不知道的HTML5——语音合成
-
如何写好一个vue组件,老夫的一年经验全在这了 如果该组件有一个参数的时候，笔者习惯使用 v-model 将该参数传入组件，减少记忆成本（毕竟 vue 官方的语法糖，不用白不用） 组件具有自身状态，当没有相关 porps 传入时，使用自身状态完成渲染和交互逻辑；当该组件被调用时，如果有相关 props 传入，那么将会交出控制权，由父组件控制其行为 <my-component…
-
【前端面试分享】- 寒冬求职上篇 在这互联网的寒冬腊月时期，虽说过了金三银四，但依旧在招人不断。更偏向于招聘高级开发工程师。本人在这期间求职，去了几家创业，小厂，大厂厮杀了一番，也得到了自己满意的offer。 整理一下自己还记得的面试题，希望能帮助到还在求职的你。大佬略过，不喜勿喷。 记录下我遇到的面试题，都有大佬分享过，附上各个大…
-
vue组件间通信六种方式（完整版） 【51CTO.com原创稿件】 前言 组件是 vue.js最强大的功能之一，而组件实例的作用域是相互独立的，这就意味着不同组件之间的数据无法相互引用。一般来说，组件可以有以下几种关系： 如上图所示，A 和 B、B 和 C、B 和 D 都是父子关系，C 和 D 是兄弟关系，A 和 C 是隔代关系（可能隔多代）。 针对不同的…
-
JS是世界上最好的语言—— 使用Electron开发桌面应用(一) 前阵子用Node+Vue搞了一个小程序的发布系统，开发期间一直在本地跑直到完成全部功能准备部署到服务器才发现了一个问题，根据官方的api小程序想要发布 必须 要依赖开发者工具！微信开发者工具会在你的本地启一个web服务，我们获取到它的端口号然后配合api才能完成上传。。。这就陷入了一个非常尴尬的局面，他喵的小程序开…
-
一张思维导图辅助你深入了解 Vue | Vue-Router | Vuex 源码架构本文内容讲解的内容：一张思维导图辅助你深入了解 Vue | Vue-Router | Vuex 源码架构。
-
前端密码加密的几种方式整理使用方式：encryptBase64(value, rsa);value代表要加密的值，rsa是前面初始化好的rsa变量。
-
你所不知道的HTML5——语音合成 听一下就会发现，播放出来的声音并不是预先录制好的音频资料，而是通过文字识别后合成的语音 请先戴上耳机，然后将下面的代码复制到chrome控制台中体验～ let msg = new SpeechSynthesisUtterance("欢迎你阅读我的博客"); window.speechSynthesis.speak(msg); 复制代码 看，前端实现语音合成并不难 今…
-
从今天开始，拿起VuePress打造属于自己的专属博客 本 blog 配套了一个基于 VuePress 的一个简单的配置案例，此配置案例包含了本 blog 绝大部分配置案例，更多详情请移步这里 VuePress配置案例 前言 问：这篇文章是干什么的？ 答：列举博客站点常见的配置并提供详细配置步骤和配置截图 问：这篇文章适合哪些人？ 答：想写博客，但并不知道如何写以及知道VuePre…
-
无限滚动插件vue-infinite-scroll源码解析 最近在项目中遇到一个需求，有一个列表需要滚动加载，类似于微博的无限滚动。当时第一反应时监听滚动事件，在判断滚动到达底部时加载下一页，同时心里也清楚，监听滚动事件需要做好截流。顺手搜索了下发现有一个现成的插件 vue-infinite-scroll ,用法也很简单，于是乎就用了起来。 需求上线后，对它的实现挺好奇的，于是…
-
vue导出excel表格 Vue按钮导出Excel文件。 1、安装三个依赖 npm install -S file-saver xlsx npm install -D script-loader 2、项目中新建一个文件夹：（vendor—名字任取） 里面放置两个文件Blob.js和 Export2Excel.js。 百度云： pan.baidu.com/s/1vJ7RnNMK… 提取码：y91k 3、调用方法 exportExcel() { &e…
-
如何写出一个利于扩展的vue路由配置 从历往经验来看，开发一个新项目，往往在刚开始部署项目，到项目的正式交付，以及交付后的后续维护，功能增强等过程，都需要对项目的一些已有结构和逻辑进行调整。 因此，如果有些内容刚建项目时不考虑好未来的可扩展性，后续调整会很麻烦。 这里先来说，在vue项目中，如何写路由配置，更利于未来可扩展。 vue-rou…
-
vue项目前端知识点整理在导航守卫中可以在next({})中设置replace: true来重定向到改路由，跟router.replace()相同
-
一图看懂编程语言迁移模式：终点站是Python、Go、JS 有着20年编程经验的资深程序员，以自己多年来的经历，总结出程序员的编程语言切换规律，做了一个主流编程语言的进阶流程图，展示不同编程语言之间的承接关系、程序员选择编程语言的方向和路径。 铁打的程序员，流水的编程语言。时代在发展，编程语言也与时俱进，不断有新的、更好或者更时髦的语言出现，程序员也会或主…
-
What's New in JavaScript 前几天 Google IO 上 V8 团队为我们分享了 《What’s New in JavaScript》 主题，分享的语速很慢推荐大家可以都去听听就当锻炼下听力了。看完之后我整理了一个文字版帮助大家快速了解分享内容，嘉宾主要是分享了以下几点： JS 解析快了 2 倍 async 执行快了 11 倍 平均减少了 20% 的内存使用 class filed…
-
JavaScript 中实现 sleep 来自推特上 Windows 故障分析的笑话 图片来源： me.me 推上看到的笑话，Windows 故障分析的实现。 然后想起来 JavaScript 中如何实现这个 sleep() 函数让代码暂停指定时间。 异步版本 借助 Promise 这事很好实现。 function sleep(time) { return new Promise(resolve => { setTimeout(() =>…
-
重学JavaScript深入理解系列（二） 我们总是会在程序中定义一些函数和变量，之后会使用这些函数和变量来构建我们的系统。 然而，对于解释器来说，它又是如何以及从哪里找到这些数据的(函数，变量)？当引用一个对象的时候，在解释器内部又发生了什么？ 我们大多数人都知道，变量和执行上下文是密切相关的: var a = 10; // 全局上下文中的变量 …
-
7中方式来减少webpack bundle体积 该方式对于开发者模式是很有必要的。该模式会自动将 剔除 空格、新的行，还有没有用到的代码。并且该模式下会将一些公共库例如 React 的调试代码排除在外。 实现 在进行项目打包的时候，针对webpack使用 -p 的标签同时 –mode production 。 webpack -p –mode production 复制代码 上面的代码…
-
三分钟掌握 React 高阶组件掌握这个有用的模式，停止在 React Components 中重复逻辑！ 原文：React Higher Order Components in 3 minutes作者：Jhey Tompkins译者：博轩 PS：今天是母亲节，先祝所有母亲大人们节日快乐啦
-
前端插件库DataTables是jQuery的JavaScript函数库，目的是强化表格操作（如搜索、排序），并自动加入组件引入表格中，使用非常灵活简便。
-
让你从头到尾把promise整的明明白白 最近一直私下在看Android项目，前端这一块没怎么仔细研究。昨天在写重构公司前端项目的时候，我发现一旦有异步的任务，脑海里面条件反射一般的出现promise的字样。重构的多了 心就就在纳闷：既然promise这么好用，我能不能自己手写一个promise呢？我思索了半天，按照自己的想法模拟了出来，但是和一位大佬交流的时候，他…
-
JavaScript之内存机制 执行栈，也叫调用栈，具有 LIFO（后进先出）结构，用于存储在代码执行期间创建的所有执行上下文。 首次运行JS代码时，会创建一个全局执行上下文并Push到当前的执行栈中。每当发生函数调用，引擎都会为该函数创建一个新的函数执行上下文并Push到当前执行栈的栈顶。 根据执行栈LIFO规则，当栈顶函数运行完成后，其对应的…
-
js函数柯里化 由于最近离职找工作的事情，好久不写文章了，就只好把2017年写的文章搬出来骗骗赞了hhh。 概念 用我自己的话来总结一下，函数柯里化的意思就是你可以一次传很多参数给curry函数，也可以分多次传递，curry函数每次都会返回一个函数去处理剩下的参数，一直到返回最后的结果。 实例 这里还是举几个例子来说明一下：…
-
JavaScript数据结构与算法-String 给定一个字符串，你需要反转字符串中每个单词的字符顺序，同时仍保留空格和单词的初始顺序。 示例 1: 输入: "Let’s take LeetCode contest" 输出: "s’teL ekat edoCteeL tsetnoc" 注意：在字符串中，每个单词由单个空格分隔，并且字符串中不会有任何额外的空格。 主要就是用到了数组的 …
-
vue实现歌手列表字母排序，下拉滚动条侧栏排序实时更新 今天写项目的时候遇到了歌手排序的问题，联想到了我们平时的手机通讯录侧栏字母排序，按照ABCDE这样的顺序对名字进行排序 我们先来看看效果 那就用vue来实现一遍 首先新建一个vue页面，取名为helloworld.vue 在页面里写入内容 <template> <div class="hello"> <div clas…
-
Web 指纹识别技术研究与优化实现 *本文原创作者：Tide重剑无锋，本文属FreeBuf原创奖励计划，未经许可禁止转载 本文通过分析web指纹的检测对象、检测方法、检测原理及常用工具，设计了一个简易的指纹搜集脚本来协助发现新指纹，并提取了多个开源指纹识别工具的规则库并进行了规则重组，开发了一个简单快捷的指纹识别小工具TideFinger，并实…
-
重学JavaScript深入理解系列 每当控制器到达ECMAScript可执行代码的时候，控制器就进入了一个执行上下文。 执行上下文(简称:EC) 以后出去要说EC因为够逼格:smirk: EC是个抽象的概念，ECMA-262标准中用它来区分不同类型的可执行代码。 标准中并没有从技术实现的角度来定义可执行上下文的具体结构和类型；这是现实标准的ECMAScript引擎所要考虑…
-
ES6中的class是如何实现的？（附Babel编译的ES5代码详解） 今天强行被某大厂社招面试了一波，时长持续半个小时，以面试官的一句“面试反馈还挺好的，希望以后保持联系”告终。时间节点发生在辞掉实习回学校做毕设的时候，这场面试就显得格外刺激。基础的数据结构和算法题都回答一二，但是也暴露了对ES6底层代码实现的不求甚解。不经过刻意准备的面试，也是原始状态的真实体现。 …
-
《图解 http》阅读笔记：web 及网络基础 网络基础 TCP / IP 通常使用的网络（包括互联网）是在 TCP / IP 协议族的基础上运作的，而 HTTP 属于它内部的一个子集。Web 使用一种名为 HTTP（HyperText Transfer Protocol，超文本传输协议）的协议作为规范，完成从客户端（指通过发送请求获取服务器资源的 Web 浏览器等）到服务器端等一系列运作流程，而协…
-
图解JS原型链中的三角恋 直接上图！额(⊙o⊙)…，有点乱！不着急，让我们一步步来理解 首先先来明确这三个属性的定义: prototype ：指向 原型对象 （函数特有属性） __proto__ ：指向构造该对象的构造函数的 原型对象 constructor ：指回该原型对象中的构造函数 步骤分析： f1,f2是构造函数Foo()实例化…
-
从头手写一个Promise 在javascript的世界中，所有代码都是单线程执行的。由于这个“缺陷”，导致JavaScript的所有网络操作，浏览器事件，都必须是异步执行。 最开始我们可以用回调函数来解决这个问题， function callBack(){ console.log(‘回调’) } setTimeout(callBack, 1000) // 回调 复制代码 但是随着业务的不断深入，难免会像陷入回调…
-
Flutter：适用于移动、Web、嵌入式和桌面平台的便携式界面框架 作者: Flutter 团队 I/O 期间我们迎来 Flutter 框架的一个重要里程碑，因为我们的开发重点从移动平台扩展到了更广泛的设备和机型。在 I/O 大会上，我们发布了 Web 版 Flutter 的首个技术预览版，宣布 Flutter 将为包括 Google Home Hub 在内的 Google Smart Display 平台提供技术支持，并迈出利用 Ch…
-
Webpack 是怎样运行的?在平时开发中我们经常会用到Webpack这个时下最流行的前端打包工具。它打包开发代码，输出能在各种浏览器运行的代码，提升了开发至发布过程的效率。
-
webpack的那些事儿 不管是vue-cli还是react-sprite，其实都是基于webpack实现的。试想，如果没有脚手架，你自己能搭一个吗？看完这篇博客，让你明白webpak都有些什么东西 webpack其实没有那么神奇，就是一个打包工具，而且它本身只能打包js，而图片，css，html其实都是依靠它的loader和plugin完成的。 webpack.config.js文…
-
详解Vue生命周期【上】 生命周期是理解Vue的一个非常重要的环节，初学Vue时可能会出现数据渲染的失败的错误，因此打算写两篇博客详细介绍Vue的生命周期： 单个组件的Vue生命周期（本文） 多个组件的Vue生命周期 Vue生命周期 1.1 beforeCreate() 说明 在实例初始化之后，数据观测 (data observer) 和 event/watcher 事件…
-
自己搭建Vue + Vuex + Typescript 项目的使用 现在很多主流语言都是强类型的，而这点也一直是JavaScript所被人诟病的地方。使用TypeScript之后，将会在代码调试、重构等步骤节省很多时间。 比如说：函数在返回值的时候可能经过复杂的操作，那我们如果想要知道这个值的结构就需要去仔细阅读这段代码。那如果有了TypeScript之后，直接就可以看到函数的返回值结构，将…
-
html自动保存图片到本地Html自动保存图片到本地
-
vue中的scoped坑点 今天在覆盖iview组件样式的时候发现一个问题，就是无法覆盖组件原有的样式，最后在github的 issue 中找到了答案： 不要使用 scoped 属性。于是我查找了下关于 scoped 的文章。 我们假设把这种组件叫做模块私有组件，其他的未加scoped的叫做模块一般组件。通过查看DOM结构发现：vue通过在DOM结构以及css样式上加唯一不…
-
如果可以，永远不要在生产中直接运行 Node.js 有时候我也在想我是否真的知道很多东西。 就在几周前，我正在和一个朋友谈话，他不经意间提到，“你永远都不会在生产中直接使用 Node 来运行程序”。我强烈点头，表示我 也 不会在生产中直接运行 Node，原因可能每个人都知道。但是我并不知道，我应该知道原因吗？我还能继续写代码吗？ 如果让我绘制一个维恩图来表示…
-
CSS实现两个球相交的粘粘效果这是一个纯粹利用CSS所做出来的效果，这个效果说穿了就是一个图像处理的原理，做法跟Photoshop里头的几乎一模一样，只是一个用图层和色版来制作，一个则是用CSS（把div当成图层思考就好了）。
-
JS之DOM和BOM1.DOM是操作页面的接口，它将页面上的元素转化为节点后分为7种类型，这7种类型的节点对象除了继承了node，parentNode，childNode的属性和方法，还继承了EventTatget的属性和方法。
-
精读《JS 中的内存管理》 本期精读的文章是： How JavaScript works: memory management + how to handle 4 common memory leaks
-
我在vue开发中的小技巧 我好不容易鼓起勇气买了一手小米，还准备等着这货下崽呢！这货就闹分手。每天下班都会有一个同事在我耳旁放风买facebook，我正准备等加班结束买一手，结果facebook来了一次“跳水”。屋漏偏逢连夜雨 呀! 今天9点半就下班了，终于有时间写东西了。本来考虑去写es6和异步操作的，写着写着感觉有点写不下了，然后想写书评，但…
-
JavaScript如何工作：引擎，运行环境和调用栈概述 Home Programming >Front end >Javascript 【翻译】JavaScript如何工作：引擎，运行环境和调用栈概述 文章目录 前言 这是一篇翻译，在查 setInterval 的浏览器如何处理的过程中看到这一系列文章，感觉对自己理解 JS引擎 以及运行环境的工作细节有很大的帮助，决…
-
React Hooks 用法与原理思考 为什么需要React Hooks ? React Hooks 是 React16.7.0-alpha版本推出的新特性。在Hoooks发布之前React定义组件有两种方法，一种是类组件，一种是函数式组件。之前这两种定义组件的方式有什么不妥呢？为啥还需要Hooks？为什么需要类组件，只有函数式组件不行吗? 因为我们组件中需要 状态 然后我们还需要生命周期来执行不…
-
JavaScript如何工作二：在V8引擎中的五个代码优化技巧 Home Essay 【翻译】JavaScript如何工作二：在V8引擎中的五个代码优化技巧 文章目录 2 为什么要创建 V8 引擎 3 V8 曾经有两个编译器 5 隐藏类 Hidden Classes 6 内联缓存 inline caching 9 如何写出优化的 JavaScript 代码 几个星期前我们开始了旨在深度挖…
-
Node.js实现一个HTTP服务器自己设计一个WEB的程序，监听80端口。支持多客户端连接，能满足客户的HTTP请求（浏览器访问），包括以下功能：
-
VUE双向绑定原理实践 近几年，前端框架层出不穷，在技术瞬息万变的时代里，关注JS语言本身，探究一些框架底层实现原理也许会让我们走得更深更远。下面是自己看vue源码的一些理解和实践，主要是对vue双向绑定原理和观察者模式做了一些实践，以v-model为例。 双向绑定原理解析 整个过程分为以下几步： 1. compile：vue对template模板中进…
-
JavaScript 个性特点：编程语言界的平头哥 JavaScript 这家伙已经疯球了，什么都不在乎的。无论你把什么玩意儿丢给他，他都能给你摆平。根本不要在这位老哥面前提什么编译错误。就是一坨??? 老哥都能给你运行。什么，你在担心他会给出一个错误的结果？都给你结果了还要啥自行车？如果你担心结果会是错的，那自己用 jest 或 mocha 弄一个测试就结了。 JavaScript…
-
es6 js装饰器decorator的使用 +webpack4.0配置decorator 许多面向对象都有decorator(装饰器)函数，比如python中也可以用decorator函数来强化代码，decorator相当于一个高阶函数，接收一个函数，返回一个被装饰后的函数。 注: javascript中也有 decorator 相关的提案，只是目前node以及各浏览器中均不支持。只能通过安装babel插件来转换代码，插件名叫这个： transform-decor…
-
webpack4.x学习笔记五，js支持ES6；css支持less、浏览器兼容 执行命令 npm install –save-dev babel-loader @babel/core @babel/preset-env 复制代码 修改webpack.config.js webpack.config.js修改后的内容 const path = require(‘path’); var htmlWebpackPlugin = require(‘html-webpack-plugin’); const extractTextPlugin = require("extract-text-webpack-plugin…
-
使用 git 篡改历史有时候我们需要修改 git 历史提交的文件内容，如果只是在前一个 commit，那么只需要修改文件并执行 –amend 即可：
-
【面试篇】寒冬求职之你必须要懂的Web安全随着互联网的发展，各种Web应用变得越来越复杂，满足了用户的各种需求的同时，各种网络安全问题也接踵而至。作为前端工程师的我们也逃不开这个问题，今天一起看一看Web前端有哪些安全问题以及我们如何去检测和防…
-
13个帮你提高开发效率的现代CSS框架本文将向你介绍一系列顶级CSS框架。有些人可能听说过，也可能对有些人是全新的。但它们都提供了各种有用的先进功能，可以改善你的工作流程。开始吧！
-
Next.js源码简析，服务端渲染过程，以及_document、_app、pages这三者调用关系在自定义服务端中通过const app = next()创建实例并使用app.render(req, res)方法进行渲染
-
webpack4-06-开发、生产环境、动态CDN配置 在开发环境中，我们需要具有强大的、具有实时重新加载(live reloading)、热模块替换(hot module replacement)能力的 source map(方便开发者调试代码) 和 localhost server（本地服务器）。 大致如下： webpack-dev-server实时重载、热替换 不压缩代码 css样式不提取至单独的文件中 使用sourceMa…
-
轻松理解JavaScript原型到原型链 说到原型和原型链可能对于每个js初学者都是一件非常头疼的事，因为它们之间的关系太绕了，网上的相关文章也是不计其数。本文将从另一个角度去理解什么是原型和原型链。 我们先认识一下什么是实例和构造函数吧。 构造函数创建对象 我们先使用构造函数创建一个对象： // 构造函数使用的是大驼峰式写法(首字母大写)…
-
【javaScript基础】执行上下文 执行上下文栈，也就是 环境栈 。全局执行环境是最外围的一个执行环境。在Web浏览器中，全局环境被认为是window对象。 var a = 1; // 全局执行环境 function fn () {}; fn(); // fn执行环境 复制代码 每个函数都有自己的执行环境。当进入一个执行环境时，该执行环境就会被推入一个环境栈中。而执行完当前执行环境，…
-
一篇文章掌握 JavaScript 事件的使用 本文采用升级的方式，由最简单的事件概念到对于 DOM 事件的常见应用。 第一：什么是事件 事件不是一个需要严格定义的技术名词。简单理解，事件就是文档或浏览器窗口中发生的交互（或动作）。比如点击或拖动一个元素、文档加载完成、Ajax 中的 onreadystatechange 事件等。 事件发生并不会导致后续行为，只有在事件…
-
基于Vue的简易MVVM实现 本文可以帮助你了解什么？ 了解MV*架构设计模式的演变历史 了解观察者设计模式 了解Vue的运行机制 了解基于Vue的简易MVVM实现过程 MV*设计模式的演变历史 我们先来花点时间想想，如果你是一个前端三贱客（Vue、React或者Angular）的开发者，你是有多么频繁的听到“MVVM”这个词，但你真正明白它的含…
前端日报栏目数据来自码农头条，每日分享互联网上热门的前端开发、移动开发、设计、资源和资讯等，为开发者提供动力，如果觉得内容对你有用，记得分享给你的小伙伴。进入码农头条查看更多
