- 博客(27)
- 收藏
- 关注
RSS订阅原创 数据结构Set和WeakSet
数据结构Set和WeakSet定义: Set是ES6提供的一种新的数据结构。它类似于数组，但是成员的值都是唯一的，没有重复的值。属性Set.prototype.constructor：构造函数，默认就是Set函数。Set.prototype.size：返回Set实例的成员总数。let set = new Set()console.dir(set.constructor); //ƒ Set() console.log(set.size); // 0set.add(1)
2020-09-01 19:02:09
138
原创 Node.js包管理工具npm的基本使用
npm的基本概念npm 是node的包管理工具它是世界上最大的软件注册表，每星期大约有 30 亿次的下载量，包含超过 600000 个 包（package） （即，代码模块）。来自各大洲的开源软件开发者使用 npm 互相分享和借鉴。包的结构使您能够轻松跟踪依赖项和版本。作用：通过npm来快速安装开发中使用的包npm不需要安装，只要安装了node，就自带了npmnpm基本使用初...
2020-09-01 18:11:07
285
原创 link和@import引入CSS文件 的区别
link 和@import 的区别@import是CSS2.1之后发布的,CSS2.1,之前的使用不了,link没有限制@import需要等页面html结构加载完毕后,才会引入CSS样式,link是同时引入@import只能引入CSS文件,link可以引入除了CSS的其他文件@improt引入的CSS不能通过JS操作样式,link引入可以...
2019-10-28 13:57:02
348
原创 JavaScript中递归函数及递归深拷贝
递归函数递归函数: 函数内部直接或者间接的调用自己递归的要求：自己调用自己（直接或者间接）要有结束条件（出口）//错误示范function fn() { console.log(123); fn();//内部再次调用函数,无限循环,没有结束条件,无限输出123}fn(); //调用fn函数//正确示范var count = 0; // 统计fn函数的调...
2019-10-25 16:24:13
251
原创 JavaScript之String对象
String对象字符串可以类似于看做是一个数组（不是真的数组——》伪数组）// 底层会默认转换成 String对象,这里是为了演示var str = new String('abcdefg');console.log( str );如下图所示:控制台输出的是一个对象,有下标,有length属性,由此可以把字符串看做是一个数组（不是真的数组——》伪数组）字符串的遍历var...
2019-10-23 18:19:26
149
原创 JavaScript之Date对象
Date对象JS提供了一个Date构造函数,通过new Date() 可以获取到一个Date对象创建一个日期对象//不传参,获取一个当前时间的对象var now = new Date();//Wed Oct 23 2019 16:05:34 GMT+0800 (中国标准时间)//(格式固定)指定具体的时间对象，后面的时分秒可以省略var date = new Date("2019...
2019-10-23 16:44:23
156
原创 bootstrap框架的基本使用
bootstrap框架Bootstrap ，来自 Twitter，是目前很受欢迎的前端框架,主要应用于响应式开发。特点：组件简洁大方、代码规范精简、界面自定义性强。Bootstrap是基于HTML5和CSS3开发的, js功能效果依赖于 jQueryBootstrap中包含了丰富的Web组件，根据这些组件，可以快速的搭建一个漂亮、功能完备的网站。版本：2.x.x 停止维护...
2019-10-23 15:12:36
4625
2
转载 CSS3 Grid 网格布局教程-转载自阮一峰
一、概述网格布局（Grid）是最强大的 CSS 布局方案。它将网页划分成一个个网格，可以任意组合不同的网格，做出各种各样的布局。以前，只能通过复杂的 CSS 框架达到的效果，现在浏览器内置了。上图这样的布局，就是 Grid 布局的拿手好戏。Grid 布局与 Flex 布局有一定的相似性，都可以指定容器内部多个项目的位置。但是，它们也存在重大区别。Flex 布局是轴线布局，只能指定"项目...
2019-10-22 10:10:14
379
原创 响应式布局的基本介绍及原理
响应式布局的介绍响应式布局（respond layout）是Ethan Marcotte在2010年5月份提出的一个概念，简而言之，就是一个网站能够兼容多个终端（pc、手机、平板）什么是响应式布局早期：同一个页面需要开发不同设备的版本，公司开发成本较高pc端需要开发写一套页面，专门给pc端看移动端再开发一套页面，专门给移动端看响应式布局：同一个页面只需要开发一套网页，...
2019-10-19 10:56:00
2992
原创 移动端rem布局基本介绍及原理
rem布局em和rem的认识在布局中，除了px之外，还有两个常见的单位，em和remem： 相对于当前元素的字体大小→ 1em = 当前标签的font-sizerem： 相对于根元素（html）的字体大小→ 1rem = html标签的font-size浏览器默认的font-size的大小为16pxrem布局的效果：屏幕越大，标签就越大屏幕越小，标签就越小rem布局的...
2019-10-19 10:22:28
5255
原创 移动端开发视口的概念及作用
移动开发的现状移动端屏幕尺寸更小移动端和pc端开发本质上一样的，都是用HTML/CSS/JavaScript的技术。问题： 移动端开发与传统的pc端开发有什么区别？浏览器不同（兼容性区别）pc端：浏览器种类很多，需要添加不同的私有前缀谷歌浏览器 苹果浏览器、 UC浏览器、QQ浏览器、欧朋浏览器、百度手机浏览器、360安全浏览器、搜狗浏览器、猎豹浏览器…移动端：浏览...
2019-10-18 21:20:41
1035
原创 用LESS函数写CSS样式简单上手教程
LESS在写css的时候，可以直接写一个.css文件，但是实际开发中也会使用less的方法写css。less的写法比css的写法功能更加强大。Less简介Less 是一门 CSS 预处理语言，它扩展了 CSS 的写法，增加了变量、函数等特性。注意点：在less中，完全兼容css的语法，所以可以直接在less文件中写css没问题浏览器不认识less文件，需要需要使用less中的样式，...
2019-10-18 18:19:28
4736
1
原创 ES5数组五个迭代方法
ES5迭代方法ES5主要新增了5个迭代方法forEach()var arr = [11, 22, 33, 44];//形参可以传三个(有需要则传,不需要则不传)//v: 数组中每一项//i: 数组中每一项的下标//arr1: 数组本身arr.forEach(function (v, i, arr1) { // 遍历数组每一项,输出4个结果 console.log(v);...
2019-10-18 08:28:08
549
原创 分析call,apply,bind作用
call,apply,bind是Function.prototype原型上的方法任何函数都可以访问call,apply,bind方法(原因:任何函数的原型链上都有Function.prototype原型) bind,apply,call的区别 ...
2019-10-17 08:25:37
747
3
原创 JQuery源码整体架构分析
JQuery源码整体架构分析本文分析的jq版本为1.7.0//首先把jquery架构内部代码全部删除(function () { })()//很明显可以看出这是个函数的自调用函数自调用的好处:形成沙箱模式,防止全局变量污染问题//我们都知道在使用jquey功能的时候可以用$ 和 jQuery作为标识符,那他们是哪里来的?(function (window, undef...
2019-10-16 09:04:56
267
原创 JavaScript之Math对象
Math对象Math对象中封装很多与数学相关的属性和方法。Math对象没有构造函数Math()，无需创建它，通过把 Math 作为对象使用可以直接调用其所有属性和方法。圆周率// 圆周率 π Math.PIconsole.log( Math.PI );//3.141592653589793最大值/最小值(重要)//最大值：Math.max()//最小值：Math....
2019-10-15 08:27:25
254
转载 BFC 神奇背后的原理
BFC神奇背后的原理BFC 已经是一个耳听熟闻的词语了，网上有许多关于 BFC 的文章，介绍了如何触发 BFC 以及 BFC 的一些用处（如清浮动，防止 margin 重叠等）。虽然我知道如何利用 BFC 解决这些问题，但当别人问我 BFC 是什么，我还是不能很有底气地解释清楚。于是这两天仔细阅读了CSS2.1 spec 和许多文章来全面地理解BFC。一、BFC是什么？在解释 BFC 是什么...
2019-10-14 15:54:27
410
原创 移动端流式布局(百分比布局)
流式布局布局特征:高度写死，宽度自适应。并不是百分百还原设计图比如：设计图是针对320px屏幕设计的，那么只有在320设备的屏幕中，才是完美的效果，其他情况都会拉伸小图片、小图标、文字大小一般写死大图片一般宽度自适应，高度等比例缩放(例如:轮播图)经典的流式布局：左侧固定，右侧自适应方法有很多种,简单例举3种。//html结构如下: <div c...
2019-10-13 12:37:30
2503
6
原创 函数的四种调用模式=>分析this指向
函数的四种调用模式注意:在函数声明的时候是无法确定this的指向,只有当函数调用的时候才能确定下来！在函数中this的指向是灵活的,要想知道this的指向需要分析两点:1.看this是属于哪个函数的2.看函数是何种调用模式根据函数内部this的指向不同，可以将函数的调用模式分成4种函数调用模式构造函数调用模式方法调用模式上下文调用模式（借用方法模式）函数：当一个函数不是一个...
2019-10-12 21:46:52
418
原创 JavaScipt中三种常用的继承方法
JS中的继承:一个对象可以使用另一个对象的成员(属性和方法)目的:方便代码的复用继承的三种方式1.原型链继承2.借用构造函数继承3.组合继承原型链继承的写法1.往原型对象身上逐一添加属性和方法//创建一个构造函数Person,并且身上并没有任何属性和方法function Person() {}//给构造函数的原型上添加了属性sayHi方法Person.prototype.c...
2019-10-12 16:59:45
917
3
原创 清除浮动的四种方式
方法一: 定高法强行给父元素添加一个高度弊端:后期不好维护方法二: 额外标签法在浮动元素最后面添加一个块级元素给这个块级元素添加一个clear:both就可以解决这个问题弊端:每一次清除浮动都需要添加一个额外标签 <div class="father"> <div class="son"></div> <div style=...
2019-10-11 09:33:42
316
原创 ES3、ES5、ES6数组常用的方法
Array对象js中内置了一个Array构造函数,可以创建数组对象,本文主要介绍数ES3、ES5、ES6数组中一些常用的方法。join(字符串分隔符)// 语法：arr.join(分隔符)var arr = ['刘备','张飞','关羽'];// 不传参数，默认每一项之间以 逗号 进行拼接var str = arr.join(); //刘备,张飞,关羽//按 - 进行拼接va...
2019-10-10 14:54:35
752
原创 jsonp原理及实现步骤
JSONP(JSON with Padding)、可用于解决主流浏览器的跨域数据访问的问题。原理：服务端返回一个预先定义好的javascript函数的调用，并且将服务器的数据以该函数参数的形式传递过来，这个方法需要前后端配合。什么是同源和跨域?同源:域名、端口、协议全都相同就是同源跨域:不同源则为跨域出于安全考虑浏览器会对跨域做出一些限制,主要限制如下:1.不能共享cookie(存储数...
2019-10-10 09:45:00
940
1
原创 JS垃圾回收机制
内存的生命周期1.分配内存(在js中自动分配)2.使用内存(读写操作)3.释放内存(在js中自动释放)垃圾回收机制所谓垃圾回收机制就是找到那些不用的值,释放其占用的内存空间,垃圾回收器每隔一段时间就会执行一次释放操作。在局部作用域中，当函数执行完毕的时候，局部变量也就没有存在的必要了，因此垃圾回收器很容易做出判断并回收。但是全局变量什么时候需要自动释放内存空间则很难判断，因此在开发中...
2019-10-10 08:57:55
653
1
原创 jquery入口函数和原生js入口函数的区别
jquery入口函数写法一;$(document).ready(function(){ 功能代码 })写法二(简写);$(function(){ 功能代码 })原生js入口函数window.οnlοad=function(){ 功能代码 }首先说一下写jquery入口函数有什么好处1.文档加载完成后执行该函数,能确保获取到元素。2.可以形成沙箱模式,防止全局变量污染问题。原生j...
2019-10-09 19:40:20
451
原创 flex布局(弹性布局、伸缩布局)
flex是CSS3中的一种布局方式主要介绍下弹性布局的常用的一些属性当一个盒子设置为display:flex的时候,盒子会变为一个弹性盒子,盒子内部的子元素会默认沿着主轴方向排布,此时会引出主轴和侧轴的概念。主轴:默认水平向右(类似于X轴)侧轴:与主轴垂直的就是侧轴,默认垂直向下(类似于Y轴)主轴方向（flex-direction)弹性盒子的主轴方向默认水平向右,但是可以通过flex-...
2019-10-09 17:29:36
3038
原创 外边距的BUG及解决方式
1.相邻块元素垂直外边距的合并当上下相邻的两个元素相遇的时候,上面元素的有margin-bottom,下面的元素有margin-top时,两者之间的间距并不是上下边距之和,而是取两者之间的较大者,这种现象称之为外边距的塌陷。如下图所示解决方法:避免就好!2.嵌套块元素垂直外边距的合并对于两个嵌套关系的块元素，如果父元素没有上内边距及边框，则父元素的上外边距会与子元素的上外边距发生合并，合...
2019-10-09 15:24:28
706
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人