熊家顺-CSDN博客

原创 for循环

今天我们来聊聊for循环，for(条件一;条件二;条件三){//循环体}这就是for循环的构造条件一：var 一个值条件二:进入循环的判断条件条件三:var 的值每一次循环完后，是否递增或递减循环体：就是你输入所要循环的代码的地方执行顺序:先执行条件一，再看条件一是否满足条件二的判断，如果满足则进入循环，反之则不进入循环，如果进入循环里则执行循环体里面的内容，最后再执行条件三。一般for循环样式为for(var i=0;i<10;i++){console.log("1");/

2021-01-19 20:01:20 78438 15

原创 vue-cli +vant ui 编写移动端所遇见的一些问题

1.后端接口在不报错的前提下，前端不应该出现页面上的一些错误比如当你使用v-for进行循环便利数据时，如果后台给你返回的数据不是0，而是null，那么你当时在渲染时需要考虑到是否用一个默认值来代替初始数据，使用v-if配合v-else来实现数据没有的情况，再比如当你使用数据渲染时如果没有这条数据，那么你也同样需要注意，当然有人会说，当时接口对接时都会先事先对好，但是你需要注意的是，不是每一个公司都有api文档，更需要注意的是，当你给一个渲染的变量使用一个方法时，那么这个你一定要设置一个默认值，不然当数

2021-08-11 16:38:30 432

原创 node express中间键

上一篇我们学习了node简单编写接口，是使用HTTP模块实现的，但是我们知道最总成型的模块还是express，所以我们今天来学学express最为关键的中间件概念一个请求发送到服务器，要经历一个生命周期，服务端要：监听请求-解析请求-响应请求，服务器在处理这一过程的时候，有时候就很复杂了，将这些复杂的业务拆开成一个个子部分，子部分就是一个个中间件。对于处理请求来说，在响应发出之前，可以对请求和该级响应做一些操作，并且可以将这个处理结果传递给下一个处理步骤中间件就可以理解成一个对请求进行过滤和预处理

2021-06-07 14:01:00 245

原创 node 接口编写(简单)

这里我也就不废话了，这里我就不讲数据爬取了，直接给大家展示这里我会将一个整体的接口分为几个单独的模块，进行封装(为了以后多功能的处理，防止出错后，不方便查找)，这里我使用的是http 不是express数据库的链接(mysql模块.js)数据库的链接我单独放在一个js文件里面(mysql模块.js)// 导入mysql模块var mysql = require('mysql');// 创建数据库连接var connection = mysql.createConnection({ hos

2021-05-22 17:49:57 4414 2

原创 node 模块讲解(初级)

我们先来了解一下node.jsNode.js是一项服务器技术。我们都知道客户端提出服务请求，而服务器端负责处理请求并提供服务。而对于互联网来说，在Node.js之前JavaScript是一项完全的客户端技术，被用于浏览器中实现各种动画，对DOM的操作等等。而后端，即服务端则是由PHP、Python、Ruby、Java等等语言来实现。Node.js的出现，使得前后端使用同一种语言，统一模型的梦想得以实现。初始化模块npm init -y常用的内置模块有1、path模块：用于处理文件路径。pat

2021-05-22 17:09:51 273 3

原创 es6 Set与Map底层原理浅讲

今天我们来简单的写一下Set与Map的底层代码经过上一篇文章大家也或多或少对Set与Map数据类型有了一定的认知，那么废话不多说，开整。今天我们要写的Set功能有1.size(返回Set实例的成员总数)2.has(返回一个布尔值，表示该值是否为Set的成员)3.delete(删除某个值，返回一个布尔值，表示删除是否成功)4.clear(清空整个Set)5.add(添加某个值，返回 Set 结构本身)class Seter { constructor(aggregat

2021-05-10 20:14:45 983

原创 es6 set与map数据结构

es6新增集合类型set与map#setset是ES6里面提供的一种新的数据结构它类似于数组但是他里面所有的成员都是唯一的这里我们会发现相同的数据已经被去除了，可以用来对数组去重，但是大家得注意这个是set类型的所以这样就是一个完整的set去重数组了在set传参过程中大家需要注意Set创建时传递的参数必须是可以进行遍历的否则就会报错(typeError)数组伪数组都可以作为参数接下来我们具体来看一下set的方法1.add 添加到set的最后一位2.has 判断set

2021-05-07 20:35:10 175

原创 es6 迭代器，生成器

今天我们来讲一下什么是迭代器和生成器。迭代器1.先来说一下什么是迭代？将一种数据结构按照一定的顺序不断取出的一个过程叫做迭代迭代是将数据依次取出不能保证把数据全部取出完也不能确定取出多少2.什么是迭代器对迭代过程的封装，一般封装对象迭代器拥有获取下一个数据的功能在返回的数据中有数据状态，判断是否可以继续向下迭代3.js中规定的迭代器js中规定一个对象中含有next方法并且这个next方法返回一个对象那么我们就认为这个对象为迭代器迭代器(对象)var obj =

2021-05-06 20:20:56 99

原创 less入门

Less简单介绍Less 是一门 CSS 预处理语言，它扩展了 CSS 语言，增加了变量、Mixin、函数等特性，使 CSS 更易维护和扩展。Less 扩充了 CSS 语言,增加了诸如变量、混合(mixin)、运算、函数等功能。Less 既可以运行在服务器端(Node.js 和 Rhino 平台)也可以运行在客户端(浏览器)。对于初学者来说，不会用node来安装，可以直接在Visual Studio Code编辑器里下载Easy LESS插件。装好了插件我们就可以写less代码了（当我们再Visu

2021-05-05 21:06:02 357

原创 ajax简易封装

如果对ajax还是有些困惑的朋友可以看看我的上一篇文章ajax详解AJAX封装1.通俗易懂版我们先将一个ajax的模板放过来给大家展示一下,并在上面进行分析var xhr=new XMLHttpRequest() xhr.open("get","B")//这里肯定是需要两个参数的，第一个为请求方式//第二个是当请求为get时需要路径与参数拼接以及为post时只是路径 xhr.setRequestHeader("Content-type", "applicatio

2021-04-22 21:03:15 195

原创 ajax详解

相信大家对ajax都有一定的了解,所以什么是ajax呢？ajax是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术(局部加载)，一般运用在网页登录注册，页面检测你所输入的数值在后台是否被注册，如果被注册则会提醒你已被占用，你需要换其他方式注册。ajax五部曲1.get四部曲(因为get可以忽略设置响应头)第一步:创建请求对象var xhr=new XMLHttpRequest()//注意后面括号不要掉为什么要将名字设置为xhr呢因为它是XMLHttpRequest的缩写，规范化第二

2021-04-22 19:38:31 435 1

原创 js异步加载的三种方式

第一种 defer (ie适用) <script defer></script>第二种 async(只能加载外部脚本，不能将代码写在script中)<script src="xxx.js" async></script>第三种按需加载function loadScript(url, callback) { var script = document.createElement('script');

2021-04-12 11:12:37 176

原创 js小案例(排他)

排他的就是排除所有人,然后设置自己上案例效果是(其实就运用了一个移入移出事件)主干结构<div class="box" id = "box"> <ul> <li><img src="0.jpg" alt=""></li> <li><img src="0.jpg" alt=""></li> <li><

2021-04-07 20:07:52 159

原创 jQuery初讲(3)

今天我们接着昨天讲的API继续讲今天我们用的结构 <div id="box"> <span class="son"> <span></span> </span> <span class="son"></span> <span class="son"></span> </div> &l

2021-04-07 19:28:13 80

原创 jQuery初讲(2)

记住jQuery的特点1.获取元素2.链式调用3.循环操作且在不同的jQuery版本中有些方法是被废弃的(没有的)今天我们再来讲讲一些jQuery的API1.get(num)取得其中一个匹配的元素(从前面一类中寻找)，num填下标，跟数组一样(返回dom对象)2.eq(num)获取当前链式操作中第num个jQuery对象(返回jQuery对象)num也是填下标，可为负值3.find(num)搜索所有与指定表达式匹配的元素(后代)。num填需要寻找的标签名$("p").find("sp

2021-04-06 20:29:15 105

原创 canvas 简易时钟

今天我们来写一个非常简单的canvas时钟canvas大家应该都很熟悉是像素图，svg是矢量图话不多说，写代码这是最终效果图 <canvas width="500px" height="500px"></canvas> <div id="father">  <span id="one"></span>

2021-04-06 20:00:37 130

原创 jQuery初讲

在学习jQuery之前我们先要了解一下jQuery到底是什么?jQuery不是一个框架而是一个JavaScript的插件库，里面都是函数，并非是个全新的东西，但是jQuery跟JavaScript里面的相同意思的属性写法有些不同(下面我们会讲到)，我们不能将前面学习的原生JavaScript抛弃(遗忘)，两者都要记住，不要混淆，虽然现在公司招聘里面没有明确提出大家一定要学会jQuery(任然有部分公司需要你掌握)，但是会jQuery一定会在面试官眼前加分。我们为什么要用jQuery？养成write l

2021-03-31 20:38:20 142

原创 js原型链初讲

我们在讲原型链前我们先把下面两个东西复习一下原型(prototype)以前我们都说万物皆对象现在所有的对象都是通过new 构造函数创建的所有的函数都有一个属性，prototype被称为函数原型在默认的情况下，prototype是一个普通的对象，在prototype中有一个属性constructor，它也是一个对象，它指向构造函数本身原型的应用1.Object.getPrototypeOf(对象) 获取对象的隐式原型2.对象 instanceof 构造函数判断对象是否是这个函数构造出来的

2021-03-12 08:46:41 84

原创 js包装类，原型，隐式原型

js基本数据类型有1.undefined 2.Boolean 3.string 4.null 5.unmber引用类型有1.object 2.function 3.array 4.data什么是类在JavaScript中我们将构造函数当成类包装类目的:为了便于操作基本类型值包装类有哪些1.BooleanBoolean() 可以将基本数据类型的布尔值转换为Boolean对象2.NumberNumber() 可以将基本数据类型的数字转换为Number

2021-03-04 20:40:15 158 1

原创 js构造函数

在学习构造函数之前我们先来了解this指向this关键字this无法进行赋值全局作用域中，this指向window构造函数中的this指向当前实例化的具体的对象（谁调用this所在的函数，那么this就指向谁）谁调用this所在的函数，那么this就指向谁什么是构造函数用 new 关键字来调用的函数，称为构造函数。注意:构造函数首字母一般大写（大驼峰命名）在我们印象中一共有三种创建方式第一种var obj={}字面量的创建第二种 function hanshu(){

2021-03-03 20:42:39 533 3

原创一些简单的前端面试题(3)

第一题var x=10;function cals(myNum) { return x+myNum; } //函数 cals(7) 返回什么？解因为前面x=10为数字类型，且myNum为7，myNum不带引号所以不是字符串类型，则为数字类型，所以两者相加。结果为17第二题//白屏时间first paint和可交互时间dom ready的关系是？(DOM)解页面的性能指标详解：白屏时间（first Paint Time）——用户从打

2021-02-23 09:13:12 388

原创 js function()函数初介绍

今天我们把js中的函数function()函数简单介绍一下。函数的作用是什么呢？主要就是将我们写的代码封装在一起，方便我们后期的调用，比如一个for循环在执行完毕后，如果我们还想要它在后面也进行使用，我们总不能又写一遍吧？所以我们使用函数来方便我们。函数的基本架构function hanshu(a,b){ } hanshu(A,B)这就是一个基本的函数，但是我们要在小括号里传入参数函数小括号里面的叫形参，调用函数小括号里面的是实参，当形参数大于实参时，传入的实

2021-02-07 16:06:18 1713

原创 array数组初体验

今天我们来学学array数组数组是什么呢？数组对象是使用单独的变量名来存储一系列的值(储存多个变量)数组的基本结构第一种:var arr=[1,2,3,4,5,6]第二种:var arr=new Array()第三种;var arr=new Array()arr[0]=1arr[1]=2arr[2]=3数组有一个length属性且数组的下标是从0开始(因为是计算机)接下来我们来讲讲基本的增删改查增以往后面增加下标的方式来增加数据如果下标不是顺着增加的那么中间的数

2021-01-25 20:43:26 157

原创一些简单的前端面试问题（2）

今天我们来探讨一下两个前端的小问题1.什么是事件模型？2.var究竟干了什么呢？3.new 操作符究竟干了什么呢？所以什么是事件模型呢?(事件模型就是事件流的传播方向,当文档中出现一些特定的交互瞬间时，就会有事件流的出现)在w3中，事件的发生分为三个阶段:捕获阶段，目标阶段，冒泡阶段。事件又被分为:冒泡型事件:指事件按照从最精确的对象到最不精确的对象的顺序逐一触发(微软提出的事件由子元素传递到父元素的过程)捕获型事件:它与冒泡型事件相反，指事件按照从最不精确的对象到最精确的对象的顺序逐

2021-01-18 20:00:20 116

原创一些简单的前端面试问题

第一篇第一题console.log(1+"2"+"2")//122console.log(1+ +"2"+"2")//32console.log("A"-"B"+"2")//NAN 2console.log("A"-"B"+2)//NAN第二题 function add(m) { return function b(n) { return n + m++ } } var add1

2021-01-12 20:43:13 139

原创 js飞翔的小鸟

今天我们来做一个简单的js游戏，飞翔的小鸟首先我们先想一下需要写些什么，1.小鸟上下的飞行移动，2.上下障碍物的创建3.页面障碍物自动从右像左移动，以实现小鸟向前飞的样子4.游戏结束后，遮罩层显示结束，以及得分5.小鸟触碰地面，最顶部，以及触碰障碍物时判定游戏结束首先还是页面的构建，每个人的想法不同，我给大家看一下我的基础界面接下来我们开始写js代码先写小鸟在没开始时自动跳动的部分现在我们写小鸟在点击开始后，跳动的部分现在创建上下障碍物(柱子)，并判断其触碰结束(因为代码长度

2021-01-11 21:01:57 1823

原创数组去重的几种简单方法

今天学习一下数组去重的几种方法，虽然不全但是实用方法一: <script> let arr=[1,2,3,5,4,8,8,4,8,8,2,2] function chuanru(arr){ let newarr=[]; for(var i=0;i<arr.length;i++){ if(newarr.indexOf(arr[i])===-1){ n

2021-01-06 21:03:53 686

转载 ajax请求get与post请求的优缺点

今天我们来学一下ajax的优缺点，Get和Post在面试中一般都会问到，一般的区别：（1）post更安全（不会作为url的一部分，不会被缓存、保存在服务器日志、以及浏览器浏览记录中）（2）post发送的数据更大（get有url长度限制）（3）post能发送更多的数据类型（get只能发送ASCII字符）（4）post比get慢（5）post用于修改和写入数据，get一般用于搜索排序和筛选之类的操作（淘宝，支付宝的搜索查询都是get提交），目的是资源的获取，读取数据虽然在开发中经常用get或者po

2021-01-05 20:16:21 505

原创 ajax请求

今天我们来学习一下ajax的几种请求方式ajax共有两种请求方式第一种get请求第二种是post请求第一种get请求，get请求又分为有参与无参get无参

2021-01-05 20:11:13 2190

原创 css3动画(3D)

上一篇我讲完了动画里面的2D动画，今天我来给大家讲一下3D动画。3D动画又叫做3D变形2D动画只有x，y轴3D动画多了个z轴，让元素变得立体起来3D动画跟以前我们学习物理时3D坐标系有点相识但是并不是一样的，毕竟现在我们要做的是动画，电脑里面的.x轴左边是负，右边是正y轴上边是负，下边是正z轴里面是负，外面是正1.rotateX()沿着x轴立体旋转rotateY()沿着y轴立体旋转rotateZ()沿着z轴立体旋转rotate3d(x,y,z,角度(deg))前三个参数取值范

2020-12-23 20:00:48 1019

原创 css3动画（2D）

上一篇博客里我用到了动画，虽然使用的是js，但是今天我们就来了解(学习)一下c3动画吧。css3动画(2D)1.在c3中最最关键的是transition(过渡)当元素从一种样式变换成另一种样式时，为元素添加效果。因为在css3中使用transition会起到一个过渡的效果，能实现元素的平滑过渡，我们通常使用hover(伪类选择器)但是并不局限于此。transition:(a b c d)其中4个属性分别代表a=需要过渡的属性 (通常用all所有属性都变化过渡)b=过渡属性需要的时间(就是从初始

2020-12-22 20:38:44 328

原创手写轮播图

一个"高级"轮播图大家好我们今天来整一个高级轮播图，轮播图嘛，大家可能在网上可以找到各种插件，但是我觉得自己会手写轮播图很重要，能帮大家复习一下js前面的知识，如果哪天你去面试，项目经理让你写个轮播图，你说你会用插件，那是不是有点不好呢。废话就不说了，开整。第一步:先思考写个轮播图需要什么东西。第二步:用css搭建个模型第三步:动手写js首先我们要知道轮播图的图片应为动态添加，这样后期才方便添加别的图片，当然图片的序号也要动态添加，毕竟得与图片数量对应，然后就是要添加页面左右两边的小箭头了(当鼠标

2020-12-17 20:54:34 2434

原创 js制作简易视频弹幕

js制作简易弹幕制作的原因:大家在直播或者视频软件上应该常常看见各种弹幕，我想大家应该也想知道弹幕是怎么做出来的，那么我们今天一起来制作一下简易弹幕。主体思路:简易弹幕原理就是将用户输入的文字存储到一个标签(我用的是span)里面，然后将其在页面的右侧弹出。我们纵观各种直播平台的弹幕整体布局css样式就不写出来了毕竟每个人审美不同需要注意的点有1.弹幕字体颜色可以随机改变(这里就直接上图片了，这样大家也可以自己敲一敲)2.弹幕字体位置也是需要随机的，总不能一直在一个点输出。3.布局上面有一

2020-12-09 14:31:59 975

weixin_51116095的博客