自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

吉帅振博客

前端学习经验分享

  • 博客(94)
  • 收藏
  • 关注

原创 【JS函数】JS函数之防抖、节流函数

一、防抖debounce函数1.定义n秒后执行,事件触发后延迟执行,输入期间不执行触发操作。无操作及延迟时间过后触发,一般适用于频繁触发的操作。2.应用场景输入框中频繁的输入内容,搜索或者提交信息;频繁的点击按钮,触发某个事件;监听浏览器滚动事件,完成某些特定操作;用户缩放浏览器的resize事件。3.基本实现 二、节流throttle函数1.定义n秒内只执行一次,节流函数是规定一段时间内无法触发,时间过了才触发,即使不断输入值,但只要1秒钟过了,也会触发。2.应用场景监听页面的滚动事件;鼠标移动事件

2022-06-29 09:40:43 802 4

转载 【JS函数】JS函数之定时器函数

定时器中的函数挂载在window对象上,内部的this指向window二、清除定时器每次使用定时器时,必须清除定时器如何清除定时器呢,每一个定时器开启后,都会返回一个对应的id,通过这个id就可以清除定时器三、关于定时器函数的参数定时器可以接受多个参数HTML5标准规定了setTimeout()的第二个参数的最小值(最短间隔),不得低于4毫秒,如果低于这个值,就会自动增加,在此之前,老版本的浏览器都将最短间隔设为10毫秒,不同的浏览器实现不同4.2有名函数4.

2022-06-28 12:13:58 1207

原创 【JS函数】JS函数之普通、构造、闭包函数

一、普通函数关于函数基础内容建议查看w3school:JavaScript 函数二、构造函数1.定义:构造函数就是初始化一个实例对象,对象的prototype属性是继承一个实例对象2.主要内容:a.默认函数首字母大写b.构造函数并没有显示返回任何东西。new 操作符会自动创建给定的类型并返回他们,当调用构造函数时,new会自动创建this对象,且类型就是构造函数类型。c.也可以在构造函数中显示调用return.如果返回的值是一个对象,它会代替新创建的对象实例返回。如果返回的值是一个原始类型,它会被忽略,新创

2022-06-27 11:50:09 304

转载 【JS继承】JS继承之ES6 Class 继承

JS是一种基于对象的语言,要实现面向对象,写法跟传统的面向对象有很大的差异。ES6引入了Class语法糖,使得JS的继承更像面向对象语言的写法。此篇博客,分为:基本介绍、Vue使用案例Class可以通过extends关键字实现继承,这比ES5的通过修改原型链实现继承,要清晰和方便很多;1234代码定义了一个Son 类,该类通过extends关键字,继承了Father类的所有属性和方法,但是由于没有部署任何代码,所以这两个类完全一样,等于复制了一个Father类。12345678910 construct

2022-06-23 13:21:27 747 2

转载 【JS继承】JS继承之寄生组合式继承

寄生组合式继承定义:所谓寄生组合式继承,即通过借用构造函数来继承属性,通过原型链的混成形式来继承方法。其背后的基本思路是:不必为了指定子类型的原型而调用超类型的构造函数,我们所需要的无非就是超类型原型的一个副本而已。本质上,就是使用寄生式继承来继承超类型的原型,然后再将结果指定给子类型的原型。一、定义父类型二、定义继承方法三、定义子类并实现继承四、输出结果总结:寄生组合式继承的高效体现在它只调用了一次Person构造函数,并且因此避免了在Pan.prototype上面创建不必要的、

2022-06-22 14:49:58 1247 5

原创 【进击的技术er】草帽计划,我和小伙伴一起乘风破浪

自我介绍:大家好,我是前端吉帅振,微信公众号:吉帅振的网络日志;前端开发工程师,工作4年,去过上海、北京,经历创业公司,进过大厂,现在郑州敲代码。近日,拉勾网CEO许单单在社交平台讲述,“一大厂被裁员工找工作时要求涨薪30%,简直是被行业惯坏了”。在他看来,互联网工资比其他行业高很多,不是因为个人能力强,而是因为大量资本投进来,现在互联网行业的红利已经到顶,互联网高薪泡沫要破了。此话一出,加入讨论的网友很多。有的人认为,许单单说的话虽然难听,却是实话,互联网行业工资高不代表能力强。“特定的年代总会有一两个代

2022-06-21 17:34:54 1985 30

原创 【JS继承】JS继承之寄生式继承

一、寄生式继承寄生式继承的思路与寄生构造函数和工厂模式类似,即创建一个仅用于封装继承过程的函数,该函数在内部以某种方式来增强对象,后再像真的是它做了所有工作一样返回对象。二、createAnother()函数createAnother()函数接收了一个参数,也就是将要作为新对象基础的对象。然后,把这个对象(original)传递给 object()函数,将返回的结果赋值给 clone。再为 clone 对象 添加一个新方法 sayHi(),后返回 clone 对象。可以像下面这样来使用 createA

2022-06-21 09:16:55 699 1

原创 【JS继承】JS继承之原型式继承

一、原型式继承原型式继承并没有使用严格意义上的构造函数,是通过借助原型基于已有的对象创建新对象,同时还不必创建自定义类型。使用原型式继承的主要思路:分析可知:在Object函数的内部先创建了一个临时性的构造函数,然后将传入的对象作为这个构造函数的原型,最后返回了这个临时类型的一个新实例。 结合例1,并在其下方添加如下代码1:克洛克福德主张这种原型式继承,要求你必须有一个对象可以作为另一个对象的基础。在代码1中,可以作为另一个对象。的基础的是person对象,于是我们可以把它传入到object

2022-06-20 11:00:07 618

原创 【JS继承】JS继承之组合继承

一、组合继承组合继承有时候也叫伪经典继承,指的是将原型链和借用构造函数技术组合到一块,从而发挥二者之长的一种继承模式,其背后的思路是使用原型链实现对原型属性和方法的继承,而通过借用构造函数来实现对实例属性的继承。这样既通过在原型上定义方法实现了函数复用,又能保证每个实例都有它的自己的属性。二、基本思想supertype构造函数定义了两个属性,name和colors。supertype的原型定义了一个方法sayname()。subtype构造函数调用supertype时传入了name参数,紧接着又定义了

2022-06-17 10:31:04 1489

原创 【JS继承】JS继承之构造函数继承

一、构造函数js中定义一个function,当使用new关键字调用这个function的时候,这个function成为一个构造函数。如下所示:二、new关键字当使用new关键字调用构造函数生成一个对象实例时,js做出的关键处理如下:1.创建一个新的对象,将构造函数内this指针指向新建对象。2.将新建对象的__proto__属性设置成构造函数的prototype属性,确保新建对象是构造函数实例。3.运行一遍构造函数,如果构造函数本身需要返回一个object或者array对象,则舍去新创建对象

2022-06-16 10:20:56 1446

原创 【JS继承】JS继承之原型链继承

1.函数所谓 函数 也就是 函数 Personal 其本身,也叫作构造函数 ,当一个函数被创建的同时,也会为其创建一个 prototype 属性,而这个属性,就是用来指向 函数原型,的我们可以把 prototype 理解为 Personal的一个属性,保存着函数原型的引用。2.函数实例函数实例 很好理解,就是上面代码中通过 new Personal() 得到的实例p,于此同时函数实例 p 内部会包含一个指向 函数原型的指针[[Prototype]],因此我们通过 p 可以去调用 函数原型 上的属性和方法

2022-06-15 09:56:21 1170

原创 【JS继承】常见的7种继承方式

一、原型式继承核心:将父类的实例作为子类的原型。优点:父类方法可以复用。缺点:父类的引用属性会被所有子类实例共享子类构建实例时不能向父类传递参数二、构造函数继承核心:将父类构造函数的内容复制给了子类的构造函数。这是所有继承中唯一一个不涉及到prototype的继承。优点:和原型链继承完全反过来父类的引用属性不会被共享子类构建实例时可以向父类传递参数缺点:父类的方法不能复用,子类实例的方法每次都是单独创建的。三、组合继承核心:原型式继承和构造函数继承的组合,兼具了二者的优点。优点:父类的方法

2022-06-14 09:34:50 4658 5

原创 【JS继承】什么是JS继承?

一、继承继承(英语:inheritance)是面向对象软件技术当中的一个概念。这种技术使得复用以前的代码非常容易,能够大大缩短开发周期,降低开发费用。继承就是子类继承父类的特征和行为,使得子类对象(实例)具有父类的属性和方法,或子类从父类继承方法,使得子类具有父类相同的行为。二、构造函数在聊JS继承方式之前,我们需要做一点准备工作,首先来聊一聊构造函数。在js中,构造函数其实和函数时一样的,写法都是函数的定义方式上面这个函数我们既可以看成是普通函数,也可以看成是一个对象的构造函数。普通函数就

2022-06-13 11:01:15 1737

原创 nodejs+express+文件操作实现小型学生管理系统(增删改查)

写在前面学习视频:https://www.bilibili.com/video/av45082360/?p=70&t=434代码地址:https://github.com/jishuaizhen/nodejs-student-crud.git知识点:express的基本操作、art-template模板引擎的使用、文件读取、请求数据获取、express路由模块的提取、body-par......

2019-04-30 20:50:03 4965 3

原创 TypeScript入门篇——基础知识(快速了解js与ts差异)

写在前面本篇文章是我初学typescript的笔记,希望可以为看到的朋友提供帮助。推荐视频:https://www.bilibili.com/video/av38379328/?p=14&t=522一、数据类型ts必须指定数据类型(给人理解将数据类型分成3种) 1.js有的类型boolean类型、number类型、string类型、array类型、undefined、null...

2019-04-28 17:37:11 42260 3

原创 react-native初学者积累的经验

写在前面1.react-native更新频率快,很多时候遇到的问题百度上之前的解决方案并不能解决问题2.开发环境的配置稍微麻烦些,但是官方文档上写得很详细,跟着一步一步做不会有问题3.很多第三方组件不能及时更新,兼容最新版本或者高版本的rn,有的第三方组件需要修改配置文件,android文件下有不同层级的同名文件,修改时需注意一、练习项目这是一个自己初步学习制作的一个小项目,主要是使用r...

2019-04-26 10:05:19 442

原创 vue初学者必看——要点介绍

一、 Vue 数据双向绑定 数据双向绑定:Object.defineProperty(obj, 'name', {Value: "",Writable:"" ,get() {},set(val) {}});二、 Vue中虚拟DOM 虚拟DOM: 其实就是一个对象。虚拟DOM2和虚拟DOM1进行比较,比较完成后(diff)DOCUMENT三、Vu...

2018-10-02 10:36:25 966

原创 Node介绍——什么是Node?

简单的说 Node.js 就是运行在服务端的 JavaScript。Node.js 是一个基于Chrome JavaScript 运行时建立的一个平台。Node.js是一个事件驱动I/O服务端JavaScript环境,基于Google的V8引擎,V8引擎执行Javascript的速度非常快,性能非常好。1.编写高性能网络服务器的javascript工具包(用js开发服务端程序)2....

2018-09-20 20:50:40 23519

原创 Ajax介绍——什么是Ajax?

AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML)。AJAX 不是新的编程语言,而是一种使用现有标准的新方法。AJAX 最大的优点是在不重新加载整个页面的情况下,可以与服务器交换数据并更新部分网页内容。AJAX 不需要任何浏览器插件,但需要用户允许JavaScript在浏览器上执行。简单案例:客户端&l...

2018-09-20 19:40:31 15878

原创 jQuery有关的插件

以下总结是自己平时用到的插件,有需要的朋友进入百度插件名字进行下载一、laydate日期插件二、validator是jQuery自带的一个表单验证插件<script>$.validator.setDefaults({    submitHandler: function() {      alert("提交事件!");    }});$().ready(func...

2018-09-19 17:08:01 174

原创 jQuery绑定事件

一、事件绑定bind(),live(),delegate(),on()绑定事件方式相同点:1.都支持单元素多事件的绑定;空格相隔方式或者大括号替代方式;2.均是通过事件冒泡方式,将事件传递到document进行事件的响应;比较和联系:1.bind()函数只能针对已经存在的元素进行事件的设置;但是live(),on(),delegate()均支持未来新添加元素的事件设置//01.事...

2018-09-19 17:01:20 225

原创 jQuery动态效果——二级菜单、左右移动、购物车计算案例

案例一:伸缩二级菜单$("html").click(function(){    if($("ul").attr("style")=='display: none;'){        $("ul").show();            }else{        $("ul").hide();    }    console.log($("ul:has(:hidden)&q

2018-09-19 16:58:11 752

原创 jQuery介绍——新手必看

一、入口函数1.JS入口函数window.onload=function(){    //执行内容}2.jquery入口函数$(documnet).ready(function(){    //执行内容});或者$(function(){    //执行内容});二、原生js节点向jquery转换var div=document.getElementById("...

2018-09-19 16:54:56 414

原创 JavaScript算法面试题:一个数组里面只有两个数出现一次,其他数出现偶数次,怎么找出这两个数?

写在前面:这种情况类似数组去重,接下来我就给大家介绍一下解决的方法第一种方法:利用对象特有的属性解决,因为对象的属性具有唯一性,所以可以把数组中的数据转换为对象的属性进行操作 var arr1=[1,2,3,4,1,2]; function seachNum(arr){ var obj={}, result=[]; for(var i=...

2018-08-04 17:58:34 1778

原创 JavaScript包装类:“原始值变对象”了解一下!

1.原始值没有属性和方法undefined、null、number、boolean、string    2.部分原始值经过包装类变成对象var num=123;//不是对象var num1=new Number(123);//是对象3.隐式包装类        var num=4;        num.len=3;//隐式发生转换,新建一个数字对象,然后添加属性并赋值,...

2018-07-30 12:55:34 381

原创 JavaScript面向对象编程详解

一、面向对象编程1.面向过程与面向对象1)面向过程:专注于如何解决一个问题的过程步骤,编程特点是由一个个函数去实现每一步的过程步骤,没有类和对象的概念。2)面向对象:专注于由哪一个对象来解决问题,编程特点是出现一个类,从类中拿到对象,由这个对象去解决具体问题。对于调用者来说,面向过程需要调用者自己去实现各种函数。而面向对象,只需要调用者了解对象中具体方法的功能,不需要了解方法中的实现细...

2018-07-25 20:27:57 451

原创 JavaScript函数作用域精解

一、作用域有关定义1.作用域每个JavaScript函数都是一个对象,对象中有些属性我们可以访问,有些不可以。不可以访问的属性仅供javascript引擎使用,[[scope]]就是其中一个。[[scope]]就是我们所说的作用域,其中存储了运行期上下文的集合2.作用域链[[scope]]中所存储执行期上下文对象的集合,这个集合呈链式链接,我们把这种链式链接叫做作用域链。3.执行期...

2018-07-20 13:39:09 383

原创 JavaScript函数中Arguments对象特殊但是超级好用

一、Arguments对象arguments对象是所有(非箭头)函数中都可用的局部变量。你可以使用arguments对象在函数中引用函数的参数。此对象包含传递给函数的每个参数,索引从0开始。如果一个函数传递三个参数,打印出来就是下面的结果:function test(){ console.log(arguments);}test(1,2,3);二、Argument...

2018-07-18 22:03:05 268

原创 JavaScript闭包函数及其作用

一、认识闭包案例:页面有5个li标签,标签显示0~4五个数字,点击不同的标签在控制台中打印标签的索引。主要代码: <ul> <li>0</li> <li>1</li> <li>2</li> <li>3</

2018-07-16 20:44:37 2887 1

原创 js实现动态轮播图功能详解

写在前面:在页面每隔一段时间实现一个动态功能时可以使用定时器,setTimeout()和setInterval()方法详解:点击打开链接注意事项:1.定时器有返回值,返回的是定时器的编号2.多次调用定时器可以产生多个定时器,产生的页面效果是循环的功能越来越快3.清除定时器方法clearTimeout()和clearInterval()只能清楚对应定时器产生的最后一个编号(如果多次调用之后使...

2018-07-14 10:28:20 2618

原创 js中可以直接用id调用函数吗?

在JavaScript中,标准的id选择器调用语法是:document.getElementById('myid').style.width = '100px';但是,今天发现,直接用id名字调用竟然也可以正确运行:myid.style.width = '100px';最后找度娘问了问,问题的答案是:这个最初是 IE 里面的,后来 firefox chrome 好像也支持,但是不建议使用。这个不是...

2018-07-13 15:50:25 4950

原创 js中这六种值为"假",其他均为"真"

写在前面:通常在以下语句结构中需要判断真假1.if分支语句2.while循环语句3.for里的第二个语句一、JavaScript中有 6 种值为“假”1.false (布尔型)2.null (用于定义空的或者不存在的引用)3.undefined (未定义值)4.0 (数值型)5."'' (空字符串) (字符型)6.NaN这里面 false 本身是布尔类型,其它 5 个则不是。除了这 ...

2018-07-13 15:35:00 6325

原创 JS DOM详解之节点的增加、删除、替换、复制,属性设置和获取,样式设置和获取

写在前面:DOM(Document Object Model ,文档对象模型)一种独立于语言,用于操作xml,html文档的应用编程接口。对于JavaScript,为了能够使JavaScript操作Html,JavaScript就有了一套自己的dom编程接口。对于Html,dom使得html形成一棵dom树,类似于一颗家族树一样,一层接一层,子子孙孙。所以说,有了DOM,在我看来就是相当于Java...

2018-07-12 20:55:14 3054

原创 js实现动态倒计时功能详解(天数、时、分、秒)

写在前面:实现倒计时功能首先是得到目标时间,然后用当前时间减去目标时间,最后将时间差传化为天数、时、分、秒。由于得到的时间不能直接运算,可以采用object.getTime()方法转化成相同类型进行运算。相关说明:如果想要显示界面好看些,可以添加一下样式。...

2018-07-12 12:47:45 35540 2

原创 js什么时候使用自定义函数

写在前面:函数可以封装功能,简化代码。当一个功能需要多次实现的时候,可以封装成函数在需要的时候进行调用,这样会节省开发时间。下面我分享一个小例子,供大家理解。主要代码://用代码实现输出日期,日期格式为:yyyy-MM-ddvar date=new Date();var month=date.getMonth()+1;var year=date.getFullYear();var day=...

2018-07-12 11:50:53 893

原创 JavaScript函数“生僻”知识点详解

写在前面:js函数中有很多“生僻”的点,一不注意就容易出错,下面是我自己总结的一些知识点。1.多个同名函数生成时会覆盖,所以在调用三个同名show函数时系统会自动调用第三个。在传参数过程中,如果传空值则被定义为undefined,undefined+undefined所得值为NaN。function show(){console.log(1);}function show(a){console.l...

2018-07-07 18:03:37 428

原创 JavaScript | for循环和while循环的区别

写在前面:for循环和while循环语法规则略有不同,两种方法可以替换使用,但是在部分问题上各有优势。主要代码://猜数字游戏,谜底:50;//用户可以猜5次 ,若用户猜的小于50,提示:猜小了;否则提示猜大了;猜中了,提示:中奖了(不能继续猜谜) var i=1; while(i<=5){ var num=prompt('请输入谜底'); if(num<50){ ...

2018-07-04 16:19:14 3517

原创 JavaScript | 简单计算器的实现

写在前面:运用js中的一些功能实现计算器加减乘除的功能。主要代码:<body> <input type="text" name="" id="txt-num1" > <select id="sel"> <option value="+">+</option>

2018-07-02 15:30:50 586

原创 JavaScript | var x= 0,y=0,t;t=x&&++y;y等0还是等1?

写在前面:在JavaScript的逻辑运算中有很多特别的个例,接下来我就将自己在学习过程中遇到的案例分享一下。1. var a=5,b=2;var result=1.0+a/b;result=result.toFixed(2);//保留小数点后两位小数toFixed(num)保留小数点后指定位数数字,num 位数四舍五入console.log(result);//3.502.var a=3,b=5...

2018-07-02 15:24:04 2161

原创 JavaScript实现页面动态时钟模型

写在前面:实现动态时钟效果可以使用setTimeout()或setInterval()函数。setTimeout(showTime,1000);//在指定的时间(1秒)后,执行showTimesetInterval(showTime,1000);//在指定的时间(1秒)后,调用showTime函数主要代码://显示时间 定义一个函数(功能)function showTime(){ var ...

2018-06-29 19:14:49 2557

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除