- 博客(47)
- 收藏
- 关注
原创 async
javascript是一门单线程语言,即一次只能完成一个任务,若有多个任务要执行,则必须排队按照队列来执行(前一个任务完成,再执行下一个任务)。这种模式执行简单,但随着日后的需求,事务,请求增多,这种单线程模式执行效率必定低下。只要有一个任务执行消耗了很长时间,在这个时间里后面的任务无法执行。常见的浏览器无响应(假死),往往就是因为某一段Javascript代码长时间运行(比如死循环),导致整个页面卡在这个地方,其他任务无法执行。(弊端)为了解决这个问题,javascript语言将任务执行模式分成同步和
2020-07-20 19:38:53
234
原创 Nodejs-----express框架
之前说过:Node.js 是运行在服务端的 JavaScript,也是一个基于Chrome JavaScript 运行时建立的一个平台。这个平台包含了许多的模块,express就是其中之一。什么是express?Express 是一个简洁而灵活的 node.js Web应用框架, 提供了一系列强大特性帮助你创建各种 Web 应用,和丰富的 HTTP 工具,使用 Express 可以快速地搭建一个完整功能的网站。Express 框架核心特性:1、可以设置中间件来响应 HTTP 请求。2、定义了路由表
2020-07-19 23:13:42
188
原创 nodejs文件系统(fs)
nodejs中,文件系统是其一个重要的模块之一,因为它掌控着nodejs对文件的读取和写入的方法,它需要在前台展示数据,也需要在后端写入数据。Node 导入文件系统模块(fs)语法:const fs = require("fs");之前讲过通过 write() 方法可以在页面上显示一些简单的字符串,但是作为前端需要展现的是一整个项目,众多的页面,而不仅仅是一小段字符。所以就需要用到 fs(文件系统模块)。Node.js 文件系统(fs 模块)模块中的方法均有异步和同步版本,例如读取文件内容的函数
2020-07-13 00:11:51
287
原创 nodejs简单的搭建一个服务器
作为运行在服务端的Javascript,nodejs在用来搭建一个服务器是简单而又快捷的。传统的HTPP服务器会由Aphche、Nginx、IIS之类的软件来担任,但是nodejs并不需要,nodejs提供了http模块,自身就可以用来构建服务器,而且http模块是由C++实现的,性能可靠。const http = require("http");在我们搭建服务器之前,首先要创建相对应的模块。NodeJS里面有许多的模块,当我们需要的时候,就可以通过require来创建。上面说过,nodejs提供了
2020-07-12 23:42:41
264
原创 ES6之生成器(Generator )
ES6 新引入了 Generator 函数,可以通过 yield 关键字,把函数的执行流挂起,为改变执行流程提供了可能,从而为异步编程提供解决方案。生成器函数:它允许你定义一个包含自有迭代算法的函数, 同时它可以自动维护自己的状态。生成器函数使用 function*语法编写。 最初调用时,生成器函数不执行任何代码,而是返回一种称为Generator的迭代器。 通过调用生成器的下一个方法消耗值时,Generator函数将执行,直到遇到yield关键字。Generator 函数组成:在 funct
2020-07-05 21:24:44
115
原创 ES6之迭代器
ES6作为ES5的升级版,其引入了一种新的遍历机制——iterator,即:迭代器。迭代器的使用方法: 1、通过 Symbol.iterator 创建一个迭代器,指向当前数据结构的起始位置2、随后通过 next 方法进行向下迭代指向下一个位置, next 方法会返回当前位置的对象,对象包含了 value 和 done 两个属性, value 是当前属性的值, done 用于判断是否遍历结束3、当 done 为 true 时则遍历结束//假如有一个数组const items = ["zero",
2020-07-05 20:53:44
93
原创 ES6——class类
在ES6中不再像ES5一样使用原型链实现继承,而是引入Class这个概念。class (类)作为对象的模板被引入,可以通过 class 关键字定义类。class 的本质是 function。它可以让对象原型的写法更加清晰、更像面向对象编程的语法。类的声明:class 类名{ constructor(a) { this.a = a; }}
2020-06-27 22:09:16
451
原创 ES6——Symbol
作为ES5的升级版,ES6 引入了一种新的原始数据类型: Symbol ,表示独一无二的值,最大的用法是用来定义对象的唯一属性名。所以ES6中的数据类型共有七种: Number 、 String 、 Boolean 、 Object 、 null 、 undefined 和 Symbol 。Symbol的基本用法:
2020-06-27 21:13:18
105
原创 JavaScript的超集——TypeScript
TypeScript 简介:1、TypeScript 是 JavaScript 的一个超集,支持 ECMAScript 6 标准。 超集: 如果一个集合S2中的每一个元素都在集合S1中,且集合S1中可能包含S2中没有的元素,则集合S1就是S2的一个超集,反过来,S2是S1的子集。 S1是S2的超集,若S1中一定有S2中没有的元素,则S1是S2的真超集,反过来S2是S1的真子集。
2020-06-22 18:29:15
528
原创 Ajax的基本介绍
Ajex:Ajax 即“Asynchronous Javascript And XML”(异步 JavaScript 和 XML),是指一种创建交互式、快速动态网页应用的网页开发技术,无需重新加载整个网页的情况下,能够更新部分网页的技术。AJAX = 异步 JavaScript 和 XML。AJAX 是一种用于创建快速动态网页的技术。通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。传统的网页(不使用 AJAX)
2020-06-21 20:09:58
288
原创 HTML之瀑布流布局
什么是瀑布流布局瀑布流,又称瀑布流式布局。 是比较流行的一种网站页面布局,视觉表现为参差不齐的多栏布局,随着页面滚动条向下滚动,这种布局还会不断加载数据块并附加至当前尾部。瀑布流布局的特点琳琅满目:整版以图片为主,大小不一的图片按照一定的规律排列。唯美:图片的风格以唯美的图片为主。操作简单:在浏览网站的时候只需要轻轻滑动一下鼠标滚轮,一切的美妙的图片精彩便可呈现在你面前。瀑布流对于图片的展现,是高效而具有吸引力的,用户一眼扫过的快速阅读模式可以在短时间内获得更多的信息量,而瀑布流里懒加载模式
2020-06-14 20:48:35
1463
1
原创 PHP变量的使用
PHP变量的声明:在HTML中我们通常会用关键字来声明一个变量。而在PHP 中没有声明变量的命令 ,变量在我们第一次赋值给它的时候被创建的。在PHP中代替关键字的是一个符号:&。<?php &text = "hello world"; &num = 10;?>PHP变量的数据类型:因为PHP是一门弱类型语言,因此PHP的变量不需要声明该数据的数据类型,PHP会自动根据变量的值来转换正确的数据类型。PHP变量的作用于:既然有了变量,那么就有了变量的作用域
2020-06-08 17:42:03
191
原创 服务端脚本语言——PHP(Hypertext Preprocessor)
什么是PHPPHP:即“超文本预处理器”,是一种通用开源脚本语言。PHP是在服务器端执行的脚本语言,与C语言类似,是常用的网站编程语言。PHP独特的语法混合了C、Java、Perl以及 PHP 自创的语法。利于学习,使用广泛,主要适用于Web开发领域PHP的语法<?php// PHP 代码?>PHP的整个代码有由 <?php 开始,以 ?> 结束,中间则是PHP代码。PHP代码规范:分号:PHP 中的每个代码行都必须以分号结束。分号是一种分隔符,用于把指令集区分开
2020-06-08 13:52:56
2061
原创 Bootstrap轮播
轮播图,相信是每个程序员都会接触到的一种图片展示方式,在Bootstrap中也为我们提供了插件来让我们简单的写出轮播图。<div id="myCarousel" class="carousel slide"> <!-- 轮播(Carousel)指标 --> <ol class="carousel-indicators"> <li data-target="#myCarousel" data-slide-to="0" class="a
2020-06-01 20:22:58
212
原创 Bootstrap下拉菜单
下拉菜单在大树网页中都有出现过,其作用就是控制一个菜单可以上下展开,是以列表格式显示链接的上下文菜单。在Boostrap里面有框架为我们写好得下拉菜单,只需要我们为一个div添加一个dropdown的类名就ok了。<div class="dropdown"> <button type="button" class="btn" data-toggle="dropdown"> 主题 </button> <ul class="dropdown-menu" &
2020-06-01 18:50:07
322
原创 jQuery Callback函数和链(chaining)
callback即回调函数,是一个通过函数指针调用的函数。如果你把函数的指针(地址)作为参数传递给另一个函数,当这个指针被用为调用它所指向的函数时,我们就说这是回调函数。回调函数不是由该函数的实现方直接调用,而是在特定的事件或条件发生时由另外的一方调用的,用于对该事件或条件进行响应。callback在jQuery中经常被用在一些效果上(例如:淡入淡出的效果),用来防止因为动画还没有完成导致动画之后的语句产生错误或页面冲突。为了避免这种情况,我们可以以参数的形式来添加callback函数。$("div"
2020-05-25 18:02:33
172
原创 jQuery fade方法
在jQuery中,fade方法有着让元素淡入淡出的效果,在jQuery中有着四种fade方法:fadeIn() :用于淡入已隐藏的元素。fadeOut():用于淡出可见元素。fadeToggle() :可以在 fadeIn() 与 fadeOut() 方法之间进行切换。fadeTo():允许渐变为给定的不透明度(值介于 0 与 1 之间)。fadeIn()jQuery中的fadein()方法能让隐藏的元素以一种慢慢显现的动画的方式展示出来。语法:$(selector).fadeIn
2020-05-25 13:22:36
1495
原创 Bootstrap模态窗口
在一些网站上,当我们点击登录按钮或者是注册按钮时,会弹出一个小的窗口在页面上显示,二页面上的内容还能隐隐约约看见,就如下面图片一样,这种样式可以使用Bootstrap中模态框来快速又简单的实现。触发器在使用模态框之前,得先要有一个触发器来触发模态框,触发器可以是按钮或者链接等,在这里我们使用按钮来当触发器。 <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#myModal">
2020-05-18 18:50:55
303
原创 bootstrap面包屑导航(Breadcrumbs)
在网页上常常有一种可以记录我们浏览过的网页的位置的一种导航栏:这样的导航栏我们称之为面包屑导航(Breadcrumbs)。面包屑导航(BreadcrumbNavigation)这个概念来自童话故事“汉赛尔和格莱特”,当汉赛尔和格莱特穿过森林时,不小心迷路了,但是他们发现在沿途走过的地方都撒下了面包屑,让这些面包屑来帮助他们找到回家的路。所以,面包屑导航的作用是告诉访问者他们目前在网站中的位置以及如何返回。Bootstrap 中的面包屑导航(Breadcrumbs)是一个简单的带有 .breadcrum
2020-05-18 18:50:36
475
原创 JQuery动画-animate()方法
语法:$( selector ).animate({ params }, speed, callback);selectot 必需的参数,一般使用某个选择器,用来寻找到执行动画的元素。params 必需的参数,元素执行动画时改变的css样式。speed 可选参数,元素执行动画所需时间。callback 可选参数,元素动画完成后所执行的函数名称。 $("div").animate({left:'250px'}); //将div距左移动250像素默认情况下,所有
2020-05-18 14:18:08
409
原创 JQuery选择器
JQuery有着许多的选择器来供我们使用,以方便我们通过JQuery来对页面的元素进行修改和添加事件。JQuery的基本选择器id选择器 $("#one").css("background","#0000FF");改变 id 为 one 的元素的背景色为 #0000FF"元素选择器 $("div").css("background","#00FFFF");改变元素名为 <div> 的所有元素的背景色为 #00FFFF"class选择器 $(".mini"
2020-05-18 13:38:15
246
1
原创 Bootstrap的代码显示
在有些专业的网站中,我们常需要显示代码,但是当我们软件在编译时,也会将我们需要展示的代码进行编译。在Bootstrap中为我们提供了两种方式显示代码:第一种 :<code> 标签。如果您想要内联显示代码,那么您应该使用 <code> 标签。<p><code><header></code> 作为内联元素被包围...
2020-05-05 22:29:41
623
原创 Bootstrap--排版
在Bootstrap框架中,开发人员已经为我们写好了一些我们经常用的样式,而我们只需要找到对应的class名字并将其添加到需要的标签里面就OK了。.lead 使段落突出显示 .small 设定小文本 (设置为父文本的 85% 大小) .text-left 设定文本左对齐 .text-right 设定文本右对齐 .text-justify 设定文本对齐,段落中超出屏幕部分文字自动换行...
2020-05-05 22:10:44
184
原创 前段框架----Bootstrap的网格系统
在我们设计一个网页时,如何合理的排布网页内容是必要的条件之一,在我么排布好内容后,如何使网页在不同的平台上能够适应其分辨率更是领我们头疼的问题,然而Bootstrap却为我们提供了一个网格系统来使页面的适应变得简单。什么是Bootstrap的网格系统Bootstrap 包含了一个响应式的、移动设备优先的、不固定的网格系统,可以随着设备或视口大小的增加而适当地扩展到 12 列。它包含了用于简单的...
2020-05-05 21:42:46
99
原创 前段框架-bootstrap
现如今,一个合格的网页必须要适应不同的显示器,不同的显示器意味着不同的分辨率,但是分辨率的不同也会导致我们所写的样式不同,所以要适应不同显示器就需要不同的样式来自适应,而前段框架 ----bootstrap就给我们提供了这样一个可以自适应不同分辨率的框架。和很多的插件一样,bootstrap也是一种插件,不过所含的功能能够使我们更简单的使用响应式设计。Bootstrap的使用:bootstra...
2020-05-05 21:03:10
276
原创 css3动画之@keyframes
我们知道,一个页面的是否美观是由css来决定的,当一个元素的css改变时,其外观也会因此而改变。那么我们对一个元素的样式进行多次改变,这个元素就会“ 动 ” 起来,形成一个动画效果。而在css3中就为我们提供了一种方法来使我们能够频繁地改变元素的样式,来让元素“ 动 ”起来,他就是 @keyframes规则。@keyframes规则@keyframes规则内指定一个 CSS 样式和动画将逐步从...
2020-04-27 17:59:31
261
原创 元素的旋转与缩放(transfrom)
transfrom是css3里面的属性,主要是运用于元素的2D或3D转换,它可以将元素旋转、缩放、移动和倾斜。语法:div{ transform:rotate(7deg);//2D旋转,括号参数为角度}transfrom属性的默认值为none,意义为不进行转换。transfrom属性有很多,能够支持我们做一些简单的2d和3d动画,例如:一个不断旋转的立方体。在使用transf...
2020-04-27 17:59:09
1556
原创 css3弹性盒子(二)弹性子元素
之前说完弹性容器的属性,再来看看弹性子元素的属性。弹性盒子由两部分组成,设置好弹性容器之后,再将子元素设置好,一个完整的弹性盒子就写好了。要想写好子元素,就需要了解子元素的属性。弹性盒子弹性子元素属性:1、order 控制弹性容器里子元素的顺序,数值小的排在前面,可以为负值值为 : 整数2、flex-grow 设置弹性子元素的扩展比率设置弹性子元素的扩展比率,不允许为负值...
2020-04-19 21:36:46
2152
原创 css3弹性盒子(一)弹性容器
弹性盒子是css3中最常用的一种布局模块,用于实现盒子里项目的对齐、方向、排序(即使在项目大小位置、动态生成的情况), 分配空白空间 。弹性盒模型最大的特性在于,能够动态修改子元素的宽度和高度,以满足在不同尺寸屏幕下的恰当布局。弹性盒子大致分为两个部分:弹性容器与弹性子元素弹性容器:弹性盒子有一个主轴(main axis)和一个纵轴(cross axis),弹性子元素沿着主轴依次排列 ,侧轴...
2020-04-19 20:50:29
809
原创 利用百度密匙创建一个简单的地图
Map:在我们使用百度地图时,第一步就是要创建一个Map的实例对象,它是地图API的核心类,用来实例化一个地图。var map = new BMap.Map("这里是地图容器的ID"); 当我们的地图创建好之后,就需要对地图进行初始化,并对地图的中心坐标和地图级别进行设置,此时我们就要用到Map下面的centerAndZoom方法centerAndZoom(center:Point,z...
2020-04-13 13:47:29
223
原创 如何在HTML5的canvas元素上绘制简单图案
canvas:canvas是HTML5中的元素,其使用JavaScript在网页上绘制图像。它拥有多种绘制路径,矩形,圆形,字符以及添加图像的方法。创建画布的方法:创建canvas画布首先要在HTML5页面中添加canvas元素:<canvas id="canvas" width = "500" height= "500"> 您的浏览器不支持canvas //当某些浏览器...
2020-04-13 13:47:13
263
原创 ES6新增API(Array.from()、Array.of()、 find( )、fill( ))
API一直是我们操作数组和对象最好用也是最便捷的方法,而在ES6中新增的不止有关键字,还有操作数组与对象的API。Array.from()将类数组对象或可迭代对象转化为数组。参数是一个数组,返回值也是一个数组。console.log(Array.from([1,2,3])); //打印值为 [1,2,3]//也可以含空位console.log(Array.from([1,2,,3]...
2020-03-30 11:41:16
294
原创 ES6的新增关键字:let 与 const
ES6:ECMAScript 的第6个版本相比较之前的版本,ES6中新增了两个javascript关键字,即:let 和 constlet作为ES6的新增关键字,let有着与我们常见的var关键字不同的特性:1、 var声明的全局变量是全部挂载到window中的,会造成全局污染,但是let声明的变量不会挂到window中,也就不会造成全局变量的污染2、 let声明的变量只在le...
2020-03-29 12:38:18
214
原创 异步加载与时间线
异步加载与同步加载异步加载:异步加载也叫非阻塞模式加载,浏览器在下载js的同时,同时还会执行后续的页面处理。在script标签内,用js创建一个script元素并插入document中,这种就是异步加载js文件了。同步加载:平常默认用的都是同步加载。如: 同步模式又称阻塞模式,会阻止浏览器的后续处理,停止了后续的文件的解析,执行,如图像的渲染。流览器之所以会采用同步模式,是因为加载的j...
2020-03-12 20:10:12
157
原创 原型以及原型链
JavaScript 常被描述为一种基于原型的语言 (prototype-based language)——每个对象拥有一个原型对象,对象以其原型为模板、从原型继承方法和属性。原型对象也可能拥有原型,并从中继承方法和属性,一层一层、以此类推。这种关系常被称为原型链 (prototype chain),它解释了为何一个对象会拥有定义在其他对象中的属性和方法。prototypeprototype ...
2020-02-14 14:24:27
124
原创 函数
1、闭包function setupSomeGlobals() {var num = 666;gAlertNumber = function() { console.log(num); }gIncreaseNumber = function() { num++; }gSetNumber = function(x) { num = x; }}setupSomeGlobals();gA...
2020-02-14 12:12:46
122
原创 正则表达式
在js中,有着一种特殊的表达式,那就是正则表达式。什么是正则表达式?正则表达式是由一个字符序列形成的搜索模式。当你在文本中搜索数据时,你可以用搜索模式来描述你要查询的内容。正则表达式可以是一个简单的字符,或一个更复杂的模式。正则表达式可用于所有文本搜索和文本替换的操作。语法:/正则表达式/修饰符;修饰符可选则性填写,经常使用的是g和i 表示全局匹配和不区分大小写。一般我们经常对...
2019-12-29 23:55:54
74
原创 JS作用域(Scope)
在js中,有着一种被称为作用域(scope)的特性。那么什么是作用域呢?作用域是在运行时代码中的某些特定部分中变量,函数和对象的可访问性,即作用域控制着变量与函数的可见性和生命周期。简单来讲,就是变量和函数生效的“范围”。而作用域又分为全局作用域和局部作用域。什么叫全局作用域?任何地方都能访问到的对象拥有全局作用域。在函数外面定义的变量就属于全局变量,拥有全局作用域。没有定义,却直接赋值的...
2019-12-23 21:05:21
939
原创 字符串的API
之前,我们说过数组几个常用的api,今天我们说说字符串的api。在编写js代码时,我们经常会对字符串进行一些操作,而合理的运用api则会使我们在操作字符串是更加方便,快捷。**1、str.indexOf()** 返回某个指定的字符串值(searchvalue)在字符串中首次出现的位置,如果没有,返回 -1,在数组中也有同样的方法,这个方法我们通常用来在字符串里面查找指定的字符串。**2、str...
2019-12-23 00:04:47
1736
原创 数组的方法之API
上一篇的文章中我们了解了一些关于数组的一部分知识,今天,我要写的是关于数组的的一些方法。这些方法能够使我们更好,更快,更便捷的使用数组。他们有一个总称:API什么是API:API(Application Programming Interface,应用程序接口)函数是一些预先定义的函数。操作系统除了协调应用程序的执行、内存分配、系统资源管理外,同时也是一个很大的服务中心,调用这个服务中心的各种...
2019-12-16 00:21:10
196
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人