20181113 前端开发日报

Vue应用框架整合与实战–Vue技术生态圈篇;用jQuery将JavaScript对象转换为querystring查询字符串;1.18 JQuery1:动态操作HTML和CSS;双十一,打包半价理解Vue的nextTick与watcher以及Dep的蓝色生死恋?;Vue SSR( Vue2 + Koa2 + Webpack4)配置指南;webpack4配置详解之慢嚼细咽;es6基础0x007:展开;用JavaScript往select元素中添加new option下拉选项

  1. Vue应用框架整合与实战–Vue技术生态圈篇 实用框架以及工具 UI组件 开发框架 实用库 服务端 辅助工具 应用实例
  2. 用jQuery将JavaScript对象转换为querystring查询字符串 在get方式的参数传递中,常常需要将JavaScript对象,转换成查询字符串,比如: { method: ‘get’, state: ‘200’ } 会转换成 ?method=get&state=200 方法1:用JavaScript serialize = function(obj) { var str = []; for (var p in obj) if (obj.hasOwnProperty(p)) { str.push(encodeURICompon…
  3. 1.18 JQuery1:动态操作HTML和CSS jquery选择器 jquery用法思想一 选择某个网页元素,然后对它进行某种操作 jquery选择器 jquery选择器可以快速地选择元素,选择规则和css样式相同,使用length属性判断是否选择成功。 $(document) //选择整个文档对象 $(‘li’) //选择所有的li元素 $(‘#myId’) //选择id为myId的网页元素 $(‘.myClass’) // …
  4. 双十一,打包半价理解Vue的nextTick与watcher以及Dep的蓝色生死恋? 一开始就只想搞清楚nextTick的一个原理,谁知道,跟吃了辣条一下,停不下来,从nextTick的源码到Watcher源码再到Dep源码,震惊,然后再结合自己之前看掘金小册理解的 双向绑定-响应式系统 ,感觉有一种 顿悟 的感觉,总之,这是我个人的理解,请大佬们指教,如有转载,请附上原文链接,毕竟我copy源码也挺累的~ 多说…
  5. Vue SSR( Vue2 + Koa2 + Webpack4)配置指南 正如Vue官方所说,SSR配置适合已经熟悉 Vue, webpack 和 Node.js 开发的开发者阅读。请先移步ssr.vuejs.org 了解手工进行SSR配置的基本内容。 从头搭建一个服务端渲染的应用是相当复杂的。如果您有SSR需求,对Webpack及Koa不是很熟悉,请直接使用NUXT.js。 本文所述内容示例在 Vue SSR Koa2 脚手架 : g…
  6. webpack4配置详解之慢嚼细咽 经常会有群友问起 webpack 、 react 、 redux 、甚至 create-react-app 配置等等方面的问题,有些是我也不懂的,慢慢从大家的相互交流中,也学到了不少。 ​ 今天就尝试着一起来聊聊 Webpack 吧,旨在帮大家加深理解、新手更容易上路,都能从0到1搭建配置自定属于自己的脚手架,或对已封装好的脚手架有进一步的巩固,…
  7. es6基础0x007:展开0x000 概述 展开符号真的是一个非常好用的东西,我常用于字符串分割、数组合并、数组拷贝、对象合并、对象拷贝。 0x001 语法 {代码…} 0x002 函数调用的时候参数展开 这是在函数调用的时候,将参数展开,和剩余…
  8. 用JavaScript往select元素中添加new option下拉选项 方法一:用原生JavaScript创建 新建option对象,appendChild select = document.getElementById(‘selectElementId’); var opt = document.createElement(‘option’); opt.value = value; opt.innerHTML = innerHTML; select.appendChild(opt); 使用options的add方法: var obj=document.getElementById("s…
  9. JavaScript专题之模拟实现new 本文共 1230 字,读完只需 5 分钟 写在前面 最近工作太忙,快接近两周没更新博客,总感觉有一些事情等着自己去做,虽然工作内容对自己提升挺大,但我总觉得,一直埋着头走路,偶尔也需要抬起头来,看看现在和自己的期望向是否脱轨,所以周末还是选择来星巴克写些文字。 今天记录 JavaScript 中 new 关键字的模拟实…
  10. 1.20 JQuery3:动画和特效 版权声明:本文为博主尹成联系QQ77025077,微信18510341407原创文章,欢迎转载侵权不究。 https://blog.csdn.net/yincheng01/article/details/83960170 jquery动画 通过animate方法可以设置元素某属性值上的动画,可以设置一个或多个属性值,动画执行完成后会执行一个函数。 $(‘#div1’).animate({ widt…
  11. JavaScript中Array方法你该知道的正确打开方法 前言 在过去的几个月,我发现我的拉取请求中存在四个完全相同的 JavaScript 错误。于是我写了这篇文章,总结了如何在 JavaScript 中正确使用地使用 Array 的方法! Array对象为JavaScript内置对象,具有以下属性: 用 Array.includes 代替 Array.indexOf “如果你要在数组中查找元素,请使用 Array.index…
  12. 摆脱redux繁琐操作,搭建mobx框架 MobX 是透明的函数响应式编,它主要优点使得状态管理变得简单和可扩展(这一点接下来我会简单的对比一下redux); React 和 MobX 是一对强力组合。React 通过提供机制把应用状态转换为可渲染组件树并对其进行渲染。而MobX提供机制来存储和更新应用状态供 React 使用。官网传送 redux和mobx对比 两者都是状…
  13. 异步 JavaScript 的演化史:从回调到 Promise 再到 Async/Await 作者|Tyler McGinnis 译者|张卫滨 本文以实际样例阐述了异步 JavaScript 的发展过程,介绍了每种实现方式的优势和不足,能够帮助读者掌握相关技术的使用方式并把握技术发展的脉络。 我最喜欢的一个站点叫做 BerkshireHathaway.com,它非常简单、高效,从 1997 年创建以来它一直都能很好地完成自己的任务。尤其值…
  14. Node.js 指南(轻松分析Node.js应用程序)有许多第三方工具可用于分析Node.js应用程序,但在许多情况下,最简单的选择是使用Node.js内置的分析器,内置的分析器使用V8内部的分析器,在程序执行期间定期对堆栈进行采样,它将这些样本的结果以及重要的优化…
  15. node.js爬虫中关村在线电瓶车信息 最近打算买一辆电瓶车来上下班,但又不知道哪个好,网上是各说纷纭啊,于是就想着,干脆用node.js自己写一个小爬虫,来爬一下中关村在线里面电瓶车的信息吧。 (以后完整代码请前往www.yubowen2003.com 暂时还在建设中,欢迎大家提issue:joy: 。) 简介 该demo采用node.js作为爬虫,为方便,有些地方使用es6语法…
  16. 如何在math.js中进行远程代码执行&漏洞的预防性修补 原文链接:https://capacitorset.github.io/mathjs/ 原文链接:https://www.zerodayinitiative.com/blog/2018/10/31/preventative-patching-produces-pwn2own-participants-panic 前言 本文简要描述了我们如何发现、利用以及提交远程代码执行(RCE)漏洞,希望这篇文章能够成为查找漏洞的指南,并且我们将一直用负一…
  17. 漏洞预警 | 知名交易所gate.io受JS代码劫持 概述 近期,网络分析平台 StatCounter 被黑客攻击,其服务代码被植入恶意脚本,加密货币交易所 gate.io 因使用此代码而受到恶意劫持,这个恶意代码劫持了通过 Gate.io 加密货币交易所的 Web 界面进行的任何比特币交易,攻击者通过替换目标地址来窃取比特币。目前,StatCounter 仍然受到了损害,而 Gate.io 已从其网站…
  18. 为什么lodash的remove在vuejs中不是响应式的? 当我们开发中希望从数组中按照某种筛选条件移除数组的一个元素时,很容易想到使用splice或者filter来操作 /* 从数组arr中移除值为val的元素 */ let index = arr.indexOf(val) index !== -1 && arr.splice(index, 1) /* 从数组arr中移除满足predicate条件的元素 */ arr = arr.filter(predicate) 复制代码 可以看到…
  19. 1.21 JQuery4:鼠标事件与滚动事件 鼠标事件 1.click和dblclick 事件方法一般都有三种使用方式:我们就以click为例来介绍这些方式,接下来的方法不再冗余介绍,只是谈论最重要的知识点。 第一种方式 <div id="test">点击触发<div> $("ele").click(function(){ alert(‘触发指定事件’) }) $("#test&quo…
  20. 1.19 JQuery2:节点插入与节点选取 节点选取 jQuery.parent(expr)   找父亲节点,可以传入expr进行过滤,比如 $("span").parent() 或者 $("span").parent(".class") jQuery.parents(expr) ,类似于 jQuery.parents(expr) ,但是是查找所有祖先元素,不限于父元素 jQuery.children(expr) .返回所有子…
  21. 轻松理解JavaScript原型及原型链 说到JavaScript的原型和原型链,相关文章已有不少,但是大都晦涩难懂。本文将换一个角度出发,先理解原型和原型链是什么,有什么作用,再去分析那些令人头疼的关系。 一、引用类型皆为对象 原型和原型链都是来源于对象而服务于对象的概念,所以我们要先明确一点: JavaScript中一切引用类型都是对象,对象就是属性…
  22. vue 源码学习 – 实例挂载 在学习vue源码之前需要先了解源码目录设计(了解各个模块的功能)丶Flow语法。 src ├── compiler # 把模板解析成 ast 语法树,ast 语法树优化,代码生成等功能。 ├── core # 核心代码 Vue.js 的灵魂 ├── platforms # 不同平台的支持 web 和 weex ├── server # 服务端渲染这部分代码是跑在服务端的 Nod…
  23. vue源码分析1-new Vue做了哪些操作 首先我们可以看到vue的源码在github上有,大家可以克隆下来。 git地址 我们主要看src下的内容。 1.现在我们来分析下 new Vue都做了哪些操作 var app = new Vue({ el: ‘#app’, mounted:{ console.log(this.message) } data: { message: ‘Hello Vue!’ } }) 复制代码 我们都知道new关…

关注github前端日报 订阅精彩文章

前端日报栏目数据来自码农头条,每日分享互联网上热门的前端开发、移动开发、设计、资源和资讯等,为开发者提供动力,如果觉得内容对你有用,记得分享给你的小伙伴。进入码农头条查看更多


关注我

我的微信公众号:前端开发博客,在后台回复以下关键字可以获取资源。

  • 回复「小抄」,领取Vue、JavaScript 和 WebComponent 小抄 PDF
  • 回复「Vue脑图」获取 Vue 相关脑图
  • 回复「思维图」获取 JavaScript 相关思维图
  • 回复「简历」获取简历制作建议
  • 回复「简历模板」获取精选的简历模板
  • 回复「加群」进入500人前端精英群
  • 回复「电子书」下载我整理的大量前端资源,含面试、Vue实战项目、CSS和JavaScript电子书等。
  • 回复「知识点」下载高清JavaScript知识点图谱

每日分享有用的前端开发知识,加我微信:caibaojian89 交流