Arashian-CSDN博客

原创 webpack（一）——概念

webpack：js应用程序的静态模版打包器（module bundler)entry[入口]：指示webpack应该用哪个模块，来作为构建其内部依赖图的开始。用法：entry:string|Array<string>【如果传入一个数组，将创建多个主入口[multi-main entry]，在你想要多个依赖文件一起注入，并且将他们的依赖导向到一个“chunk”时，传入数组的方式就...

2019-03-11 15:02:21 208

原创 XMLHttpRequest

1. Open(String method, String url, Boolean ansynch, String username, String password) 指定和服务器端交互的HTTP方法，URL地址及其他请求信息 Send(content) 向服务器发出请求，如果采用异步方式，该方法会立即返回 setRequestHeader(Stri...

2018-09-21 15:39:09 122

原创前端笔试题

1. 立即执行的匿名函数的用法 (function(){ })(); 后面的括号里可以填入参数。在一个表达式后面加上括号（），该表达式会立即执行，但是在一个语句后面加上括号（），是完全不一样的意思，只是分组操作符。自执行匿名函数和立即执行的函数表达式区别：自执行函数：function foo() { foo();} 自执行的匿名函数：...

2018-09-19 13:37:51 307

原创前端面试题

1.浏览器的缓存机制对于浏览器的缓存来讲，这些规则是在HTTP协议头和HTML页面的Meta标签中定义的。他们分别从新鲜度和校验值两个维度来规定浏览器是否可以直接使用缓存中的副本，还是需要去元服务器获得更新版本新鲜度（过期机制）：缓存副本的有效期。一个缓存副本满足以下条件，浏览器认为其有效。 ...

2018-09-19 13:37:31 130

原创 webpack

webpack：JavaScript应用程序的静态模块打包器。递归地构建一个依赖关系图，其中包含应用程序需要的每个模块，然后将这些模块打包成一个或多个bundle四个核心概念：entry ：指示webpack应该使用哪个模块开构建内部依赖图的开始。 output：在哪里输出bundles，以及如何命名 ...

2018-09-19 10:33:29 91

原创 React渲染机制与生命周期

1. 一个组件加载完毕后，如果既没有外部驱动，也没有内部驱动，是不会进行重新渲染的。2. 组件想要对自身进行刷新，可以通过调用setState()或者forceUpdate()来实现，这是让组件刷新的内部驱动3.父组件通过给子组件传递props，告知子组件有可能重新渲染，子组件自己根据传来的数据（在componentWillReceiveProps方法中）决定是否有必要进行重新渲染。 ...

2018-09-19 09:12:29 1688

原创 React创建组件的三种方式及其区别

1. 函数定义式的无状态组件创建纯展示组件，只负责根据传入的props来展示，不涉及state的操作。无状态函数式组件形式上表现为一个直带有一个render方法的组件类。 function HelloComponent(props){ return <div>Hello {props.name}</div>}ReacrDom.re...

2018-09-19 00:28:34 500

原创 Express框架-2

一、中间件 middleware处理HTTP请求的函数。最大的特点是，一个中间件处理完，再传递到下一个中间每个中间件可以从App实例接收三个参数，一次为req，res，next(表示下一个中间件的回掉函数) 二、use方法 use是express注册中间件的方法，它返回一个函数。可用来实现简单的路由app.use('/path',somemiddle...

2018-09-03 11:42:35 91

原创 Express框架-1

Express是一个为Node.js设计的web开发框架，它基于nodejs平台框架核心特性包括：可以设置中间件来响应HTTP请求定义了路由表用于执行不同的HTTP请求动作可以通过向模板传递参数来动态渲染HTML页面请求和响应Express应用使用回调函数的参数：request和response对象来处理请求和响应的数据app.get('/',function(r...

2018-09-03 11:26:34 104

原创 css权重

一.权重等级每个选择器在权重级别中都有自己泾渭分明的位置。根据选择器种类的不同可以分为四类，也决定了四种不同等级的权重值。 1.行内样式，指的是html文档中定义的style 行内样式包含在你的html中，对你的元素产生直接作用 2.ID选择器 id也是元素的一种标识，比如#div 3.类、属性选择器和伪类选择器...

2018-09-01 00:35:59 108

原创 localStorage,sessionStorage用法小结

清空：localStorage.clear()存储数据：localStorage.setItem(key,value)localStorage.key = value读取数据：localStorage.getItem(key) ：获取数据值localStorage.key(i)：获取第i个键值删除某个变量：localStorage.removeItem(key)...

2018-08-28 16:53:07 113

原创从浏览器地址栏输入url到显示页面的步骤

1. 在浏览器地址栏输入URL2. 浏览器查看缓存，如果请求资源在缓存中并且新鲜，跳转到转码步骤 2.1. 如果资源为缓存，发起新请求 2.2.如果已缓存，检验是否足够新鲜，足够新鲜直接提供给客户端，否则与服务器进行验证。 2.3.检验新鲜通常有两个HTTP头进行控制Expires和Cache-Control： HTTP1.0提供E...

2018-08-21 09:59:46 1042

原创 JavaScript中的this指向

1.全局环境下 this始终指向window2.函数上下文调用 a. 函数直接调用：严格模式（window)，非严格模式（undefined） b.对象中的this 对象内部方法的this指向调用这些方法的对象（前面是谁则指的谁）函数的定义位置不影响this指向，this指向只和调用函数的对象有关多层嵌套，指向最近的对象...

2018-08-01 15:54:10 80

原创 CSS3选择器的总结

1. *：通用选择器选择页面上全部元素，可与别的选择器嵌套使用2. #id：id选择器严格，没法复用，只针对唯一3. .class：类选择器针对某类，定位多个元素4. selector1 selector2：后代选择器只需要定位selector1下的selector2元素5.tagName：标签选择器定义页面上所有的某标签...

2018-07-19 10:43:17 167

原创 CSS常用的布局

1.常用的居中方法1.1水平居中 inline元素：对父元素设置text-align:center 定宽block元素：设置左右margin为auto 不定宽block元素：设置子元素为display:inline，然后父元素：text-align:center 通用方案：flex布局，对父元素设置： ...

2018-07-15 13:37:52 166

原创 jQuery animate()——CSS属性集自定义动画

animate() 方法执行 CSS 属性集的自定义动画。该方法通过 CSS 样式将元素从一个状态改变为另一个状态。CSS属性值是逐渐改变的，这样就可以创建动画效果。(selector).animate({styles},speed,easing,callback)styles：规定产生动画的属性集speed：规定动画的速度easing：规定在动画中不同点元素的速度。默认值是“swing” ...

2018-06-28 09:56:07 781

原创 AngularJS Select(选择框)

1.使用ng-options创建选择框<div ng-app="myApp" ng-controller="myCtrl"> <select ng-init="selectedName = names[0]" ng-model="selectedName" ng-options="x for x in names"></select&

2018-06-27 15:17:27 213

原创 AngularJS——JS框架-2-服务

AngularJS服务——服务是一个函数或对象，可在AngularJS应用中使用$location：返回当前页面的URL地址$http：向服务器发送请求，应用响应服务器传送过来的数据 $http({ method: 'GET', url: '/someUrl'}).then(function successCallback(response) { // 请求成...

2018-06-27 11:43:33 135

原创 JS框架——AngularJS-1

AngularJS 指令是以 ng 作为前缀的 HTML 属性。【HTML5允许扩展的属性，以data-开头】ng-app：定义一个AngularJS应用程序ng-model：把元素值比如输入域的值绑定到应用程序,可将输入域的值与AngularJS创建的变量绑定。双向绑定：<div ng-app="myApp" ng-controller="myCtrl"...

2018-06-26 17:51:28 235

转载 jquery中ajax方法详解

1.url：要求为String类型的参数，发送请求的地址（默认是当前网页地址）2.type：String类型的参数，请求方式（post或get，默认为get）。请注意其他http的请求方法。3.timeout：Number类型的参数，设置请求超过时间（ms）。此设置将覆盖$.ajaxSetup()方法的全局设置4.async：Boolean，默认为true，所有请求均为异步请求。如果需要发送同步请...

2018-06-22 19:37:31 184

原创 Bootstrap 导航栏

导航栏是一个很好的功能，是 Bootstrap 网站的一个突出特点。导航栏在您的应用或网站中作为导航页头的响应式基础组件。导航栏在移动设备的视图中是折叠的，随着可用视口宽度的增加，导航栏也会水平展开。在 Bootstrap 导航栏的核心中，导航栏包括了站点名称和基本的导航定义样式。默认的导航栏创建一个默认的导航栏：<nav> 标签添加class .navbar、.navba...

2018-05-25 21:20:08 3422

原创前端学习——Pug模板

1.类名和ID名 a.button a(class="button") a#button a(id = "button") 编译后：<a class="button"></a> <a id="button"></a> 如果前面没指定标签名，则默认div2.属性用（）包裹，属

2018-05-18 15:20:20 2217

原创前端学习——jQuery库

jQuery库1.$ 所有jQuery都是由$【bling】开始2.jQuery通过选择器来选择一个元素，然后操作元素做些改变. 如 $("button").addClass("animated bounce")：我们用$("button")选中按钮，用addClass("animated bounce")给按钮加CSS class 通过class选中：$(".xxx") 通过id选中...

2018-05-17 19:41:29 144

原创前端学习——参数arguments

JS中function是对象的一种，调用时传的实参个数与定义时的形参个数可以不同。解释器永远不出错。实际上，在函数体内，参数是用一个数组表示的。在函数体内可以通过arguments对象来访问这个参数数组，从而获得传的每个实参。arguments对象可以和命名参数一起使用，内存空间互相独立，值会同步。若果命名参数没有传递值，则默认为undefined。...

2018-05-17 17:05:49 202

原创前端学习——迭代数组

1.map：会迭代数组中每一个元素，并根据回调函数来处理每一个元素，最后返回一个新数组，不会改变原数组。 arr.map(function(val){...});2.reduce: 迭代一个数组，并累积到一个值中，回调函数的参数是一个累加器和当前值。reduce有个第二参数被用来设置累加器初始值，如果没有设置，默认第一项。3.filter:迭代数组，并且按给出的条件过滤出...

2018-05-16 18:43:00 292

转载 html/css DOM 脱离文档流的几种情况

所谓文档流，指的是元素排版布局过程中，元素会自动从左往右，从上往下的流式排列，并最终窗体自上而下分成一行行，并在每行中按从左至右的顺序排放元素。脱离文档流即是元素打乱了这个排列，或从排列中拿走。a.定位属性positon　　先看一下定位。看一段对定位各个字段的描述，有助于理解值描述absolute生成绝对定位的元素，相对于 static 定位以外的第一个父元素进行定位。元素的位置通过 "left"...

2018-05-08 14:55:18 407

转载前端学习——布局

1. 盒子模型margin：外边距/边界border：边框padding：内边距/填充以上属性又分上下左右四个方向。元素实际占位尺寸 = 元素尺寸+padding+边框宽度2. 最基础的页面布局结构： <div id = "container"> <div id = "header"></div> <div id...

2018-05-08 14:07:36 354

原创前端学习——标签初识

1.HTML的标签大部分元素都有一个开始标记和结束标记，如<h1></h1>在开始标记和结束标记之间可以填充Placeholder text<h>系标题 header的缩写，随着数字变大字体变小<p>段落<img>图片，自封闭元素<a> anchor 链接到外部或实现内部跳转，href为地址<ul><

2018-04-13 12:09:54 131

m0_37829710的博客