YaoDeBiAn的博客

将所学运用到方方面面

排序：
默认
按更新时间
按访问量
RSS订阅

原 记一次户外拓展感想与收获

公司组织了一次入职的户外拓展，感觉收获很多，便记录下来。。。（文笔太垃圾了。。。） 公司这次组织的户外拓展活动确实很有意义，它算不上华丽，因为在其间我们也并不轻松，不过我们也并不痛苦，和小伙伴们也是玩的比较愉快的，更重要的是它让我收获颇丰。 首先从第一个项目开始讲起吧，我们需要以自己的方式来展示我...

2019-03-16 15:08:21

阅读数 148

评论数 0

原 leetcode02-两数相加

问题描述 给出两个 非空 的链表用来表示两个非负的整数。其中，它们各自的位数是按照 逆序 的方式存储的，并且它们的每个节点只能存储一位数字。 如果，我们将这两个数相加起来，则会返回一个新的链表来表示它们的和。 您可以假设除了数字 0 之外，这两个数都不会以 0 开头。 示例： 输入：(2 -&a...

2019-03-09 15:19:30

阅读数 26

评论数 0

原 公司入职培训中学到的几种EXCEL技能，简单记录下

1.通过VLOOKUP来查询数据 首先我们看下这张图： 当前我们的需求是这样的：我想获取到表中每个人所属的一个省份信息。 我们首先找到一张信息表，如图： 我们想根据上面这张表获取每个人的省份信息，这时我们便用到了我们的VLOOKUP函数： 我们先将第一张图中的所属省份字段改成区域，因为两张表...

2019-03-08 21:40:47

阅读数 36

评论数 0

原 leetcode01-两数之和

问题描述 给定一个整数数组 nums 和一个目标值 target，请你在该数组中找出和为目标值的那 两个 整数，并返回他们的数组下标。 你可以假设每种输入只会对应一个答案。但是，你不能重复利用这个数组中同样的元素。 示例: 给定 nums = [2, 7, 11, 15], target = 9...

2019-03-07 22:55:35

阅读数 20

评论数 0

原 css3系列之css动画

github文章地址：https://github.com/yaodebian/blog/issues/1 css3系列之css动画 css动画是css3中新添加的特性，为我们提供了很多很方便的css特效，以前很多需要借助js(或者gif动效图)来完成的动画效果，简单通过css就能完成。 一.动画...

2019-02-03 22:02:54

阅读数 27

评论数 0

原 代码调试系列之前端代码调试的几种基本方法

github文章地址：https://github.com/yaodebian/blog/issues/2 知乎文章地址：https://zhuanlan.zhihu.com/p/56231646 针对前端代码的调试，我们更多的是对javascript代码的调试，我们常用的可能就是向alert...

2019-02-03 21:59:40

阅读数 742

评论数 0

原 总结一份自己写购物车的思考

知乎文章地址：https://zhuanlan.zhihu.com/p/53707400 最近在继续完善自己之前写的一个demo: yaodebian/taobaoApp​github.com 之前并没有对购物车进行特别的设计，仅仅是将一个个商品添加到购物车列表，也没有做一些处理，比如：列表...

2018-12-31 17:04:19

阅读数 54

评论数 0

原 兼容getElementsByClassName与classList（ie8及以上）

知乎文章地址：https://zhuanlan.zhihu.com/p/52423430 之前面试的时候考到对html元素的class进行增删改，然后有前辈说如果使用classList并且通过原型实现兼容，会非常满意，由此想到对getElementsByClassName与classList这两...

2018-12-17 12:57:43

阅读数 162

评论数 0

原 Webpack4.0基础教程八：生产环境构建

1. 配置： 上面是官方的原话~~~ 下面我们将会分别创建开发环境与生产环境的webpack配置文件，并将两个配置文件中公共用到的部分抽离出来，存放到一个公用配置文件中，最后通过webpack-merge这个工具我们将公共配置合并到开发与生产配置中。   首先下载webpack-mer...

2018-12-04 20:06:49

阅读数 124

评论数 0

原 Webpack4.0基础教程七：tree shaking

在此声明一下，这篇文章之前写的时候也是有点模模糊糊，应该有很多错的地方（后半部分），或者逻辑比较乱的地方，各位小伙伴如果读这篇文章的话，感觉不清晰的地方就不要去深究了，以免浪费时间，同时把你们带偏，之后会抽空把文章纠正更新一下，在此对那些可能被我带偏的伙伴说声抱歉，同时也希望看我文章的哥们、小姐姐...

2018-12-04 19:53:25

阅读数 167

评论数 8

原 Webpack4.0基础教程六：开发工具(自动编译代码)

每次要编译代码时，手动运行npm run build特别麻烦。 webpack中有几个不同的选项，可以帮助你在代码发生变化后自动编译代码： 1.webpack's Watch Mode(观察模式) 2.webpack-dev-server(提供一个服务器) 3.webpack-dev-mi...

2018-12-04 19:45:13

阅读数 122

评论数 0

原 Webpack4.0基础教程五：suorce map

当 webpack 打包源代码时，可能会很难追踪到错误和警告在源代码中的原始位置。例如，如果将三个源文件（a.js, b.js 和 c.js）打包到一个 bundle（bundle.js）中，而其中一个源文件包含一个错误，那么堆栈跟踪就会简单地指向到 bundle.js。这并通常没有太多帮助，因为...

2018-12-04 19:40:36

阅读数 65

评论数 0

原 Webpack4.0基础教程四：plugins(插件)

loader被用于转换某些类型的模块，而插件则可以用于执行范围更广的任务。插件的范围包括，从打包优化和压缩，一直到重新定义环境中的变量。插件接口功能极其强大，可以用来处理各种各样的任务。   想要使用一个插件，你只需要require()它，然后把它添加到plugins数组中。多数插件可以通过选...

2018-12-04 19:32:20

阅读数 206

评论数 0

原 Webpack4.0基础教程三：安装简单的loader解析

webpack中，有一种操作就是在“.js”文件中引入非javascript资源，所以在将其打包的过程中，我们需要某些loader解析器对相关的资源进行解析。   首先我们先来看看引入css资源： 安装style-loader和css-loader两个loader:npm install -...

2018-12-04 19:27:19

阅读数 143

评论数 0

原 Webpack4.0基础教程二：ES6的babel转码配置

1.安装babel-preset-env包：npm install –save-dev babel-preset-env 2.在根目录下创建.babelrc文件： {  "presets": [  "env"  ],  ...

2018-12-04 19:16:13

阅读数 166

评论数 0

原 Webpack4.0基础教程一：准备工作

准备工作 1.初始化项目目录：npm init -y 2.建立以下的目录结构： --dist --src ----index.js --package.json（初始化后生成） 3.完成基本的webpack配置： 首先，安装基本的webpack包： npm install --s...

2018-12-04 19:07:56

阅读数 145

评论数 0

原 一步步实现Promise代码封装

知乎文章地址：https://zhuanlan.zhihu.com/p/51373575 ES6中加入了Promise的一个概念，使得非阻塞式语句的同步变得简单起来，但是具体它是怎样实现的，接下来一步步地实现它。 一.Promise基本结构 new Promise((resolve, re...

2018-12-03 20:40:44

阅读数 266

评论数 0

原 深入理解BFC

知乎文章地址：https://zhuanlan.zhihu.com/p/50478999 一. BFC的基本概念 BFC是“Block Formatting Context”的缩写，即块格式化上下文。它是Web页面的可视化CSS渲染的一部分，是布局过程中生成块级盒子的区域，也是浮动元素与其他元...

2018-12-03 20:37:28

阅读数 47

评论数 0

原 谈谈个人对js事件循环的理解

知乎文章地址：https://zhuanlan.zhihu.com/p/50003943 在这之前，首先谈谈js的单线程机制：众所周知，js是单线程的语言，也就是说同一时间只能做一件事情。不过，现在这个年代还不能多线程开发吗？答案肯定是否定的，而关于为什么js选择用单线程，只要举一个栗子就好了：...

2018-12-03 20:32:42

阅读数 68

评论数 0

原 js事件绑定的几种方式

1.首先是直接在标签中绑定事件，如：<button onclick="clickme()"></button>; 2.通过节点元素进行绑定，如：el.onclick = f...

2018-12-03 20:30:10

阅读数 48

评论数 0

提示
确定要删除当前文章？
取消 删除
关闭
关闭