JavaScript学习之路
关注
分享
扫一扫
乌鲁托拉曼
撒大声地的
展开
-
【JavaScript】递归实现一个深拷贝
function deepCopy(obj){ // 递归退出条件 if(obj === null || typeof obj !== 'object'){ return obj; } const cloneObj = Array.isArray(obj) ? [] : {}; for(key in obj){ //判断是不是自身属性 if(obj.hasOwnProperty(key)){ if(typeof原创 2021-02-17 21:52:51 · 310 阅读 · 0 评论 -
【JavaScript】实现bind，apply和call
Function.prototype.myBind = function(ctx, ...agrs1){ const fn = this; function noopFn(){} function innerFn(...args2){ // bind返回的函数可以作为构造函数使用 // 当做构造函数时，绑定的this（即上文ctx）失效； 此时this指向new出来的实例 ctx = th原创 2021-01-11 14:51:33 · 184 阅读 · 1 评论 -
【JavaScript】手写一个promise
const PENDING = 'PENDING';const RESOLVE = 'RESOLVE';const REJECTED = 'REJECTED';function Promise(executor){ const self = this; self.status = PENDING; self.data = undefined; self.callbacks = [] // { onResolved: () => {}, onRejected:原创 2021-01-06 22:00:07 · 182 阅读 · 0 评论 -
【ts】ts学习笔记
一、函数重载// 函数重载function add(...rest: number[]):number;function add(...rest: string[]):string;function add(...rest: any):any { let first = rest[0]; if(typeof first === 'number') { return rest.reduce((pre, cur) => pre +cur); } if原创 2020-06-14 17:17:37 · 203 阅读 · 0 评论 -
【JavaScript】js闭包的10种表现形式
1.返回值var fn = function() { var name = function() { var name = 'lzx'; return function() { return name; } }}2.函数赋值, 将内部函数赋值给外部变量var fn2;var fn = functio...原创 2020-05-05 18:58:54 · 724 阅读 · 2 评论 -
【JavaScript】使用js实现3版函数节流
html jsfunction throttle(func, wait) { let prevTime = 0; return () => { args = arguments; const _this = this; let nowTime = new Date().valueOf(); if(nowTi...原创 2020-05-04 18:34:15 · 187 阅读 · 0 评论 -
【JS】使用js实现一个简单的函数防抖
// 使用节流的case：1.输入框查询2.表单验证3. 按钮提交事件4.scroll滚动事件5.resize 事件/** * @description 节流 * @param fn 传入的回调 * @param wait 间隔多少s执行 * @immediate 是否立即执行还是*/function debounce(fn, wait, immediate) { ...原创 2020-04-06 23:28:26 · 1414 阅读 · 0 评论 -
JavaScript实现二叉搜索树、前序遍历、中序遍历、后续遍历
<script type="text/javascript"> function BinaryTree(){ //建立二叉树 var Node=function(key){ this.key=key; this.left=null; this.right=null; ...原创 2018-09-04 17:32:28 · 437 阅读 · 0 评论 -
JavaScript实现超大整数相加
function add(a, b) { if (a.length &lt; b.length) { a = '0' + a; } if (b.length &lt; a.length) { n = '0' + b; } // 标志位 满十进一 va...原创 2018-09-26 20:41:59 · 1737 阅读 · 0 评论 -
用promise封装一个简单的ajax啊
function getJSON(url) { return new Promise(function(resolve, reject) { var XHR = new XMLHttpRequest(); XHR.open('GET', url, true); ...原创 2018-09-27 00:20:37 · 952 阅读 · 0 评论 -
【JavaScript】学习笔记之es6中super( )
为什么一定要在constructor中调用super如果一个子类通过extends关键字继承了父类，那么在子类的constructor构造函数中，必须优先调用一下super()，这是一种约定俗成的做法。super是一个函数，指向父类的构造函数，也可以理解为，子类中的super其实就是父类中 constructor 构造函数的一个引用...原创 2018-11-07 20:56:41 · 363 阅读 · 0 评论 -
【前端面试】对JavaScript中this的理解总结
setTimeout、setInterval中的this，严格模式和非严格模式下的this，箭头函数中的this，函数独立调用中的this1.setTimeout、setInterval中的thisvar obj ={ fn:function(){ console.log(this); }}function fn2(){ console.log(t...原创 2018-11-29 20:24:35 · 1435 阅读 · 0 评论 -
【github】github创建自己的分支并上传代码到master
1. 创建一个空的文件夹并进入使用终端进入到这个文件夹2.git clone 远程仓库链接3.创建分支： git branch 分支名字4.切换到这个分支： git checkout 分支名字5.把想要上传的代码文件放到这个文件里6. 把这个文件提交到暂存区 git add .7. git status (查看文件状态，非必须，任何时候都可以通过这个命令查看)8...原创 2018-11-28 16:56:39 · 5908 阅读 · 0 评论 -
【设计模式】实现一个简单的js发布-订阅者模式
一 概念发布—订阅模式又叫观察者模式，它定义了对象间的一种一对多的关系，让多个观察者对象同时监听某一个主题对象，当一个对象发生改变时，所有依赖于它的对象都将得到通知。二 现实中的发布订阅者模式1.比如小红最近在淘宝网上看上一双鞋子，但是呢 联系到卖家后，才发现这双鞋卖光了，但是小红对这双鞋又非常喜欢，所以呢联系卖家，问卖家什么时候有货，卖家告诉她，要等一个星期后才有货，卖家告诉小红，要是你喜...原创 2019-03-10 20:41:35 · 4220 阅读 · 0 评论 -
【NodeJs】用NodeJs模拟一个cookie
var express = require('express');var cookieParser = require('cookie-parser');var app = express();// 使用cookie-parser中间件app.get('/', function(req, res) { res.send('猜你喜欢' + req.cookies.mudidi)...原创 2019-03-24 17:50:57 · 759 阅读 · 0 评论 -
【nodeJs】使用NodeJs模拟一个session
var express = require('express');var app = express();var session = require('express-session');app.use(session({ secret: 'keyboard cat', resave: false, saveUninitialized: true}));app...原创 2019-03-24 17:57:12 · 371 阅读 · 0 评论 -
【移动端】使用js和css3的translate、transition实现的简单轮播图
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-U...原创 2019-06-24 21:11:27 · 2439 阅读 · 0 评论 -
【移动端】学习移动端的滑动手势事件
1.判断滑动的手势条件触发touchmove事件移动的超过一定的距离，如10px， 像滑动了1px，2px这类的距离太小，不能视为滑动<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content=...原创 2019-06-24 21:54:47 · 2522 阅读 · 0 评论 -
【移动端】封装一个简单的tap事件鸭
1. tap事件与click事件移动端click事件缺陷移动端也有click事件，但是在移动端为了区别是点击还是滑动（当用户触碰到屏幕的时候，可能是点击，也可能是活动），因此click事件有300ms的延迟。这个延迟在chrome浏览器模拟器中体现不到300ms的效果，只有在真机上才有。响应太慢，影响用户体验tap事件tap事件不是移动端原生事件，而是通过touch相关事件衍生（封...原创 2019-06-24 23:16:35 · 542 阅读 · 0 评论 -
如何写好JavaScript
需求： 用js实现红绿灯效果。三个状态用红（stop）、绿（pass）、黄（wait）要求用JavaScript让三个状态轮流切换，每个状态停留2sHTML <ul id="traffic" class="stop" > <li><span></span></li> <li><sp...原创 2019-08-25 16:47:17 · 248 阅读 · 0 评论 -
使用js数组和事件完成的一个小玩意儿
图片开始半透明的鼠标放上去后代码实现1.样式*{ margin: 0; padding: 0; } .dage{ width: 510px; height: 510px; background: #ccc; margin: 20px auto; ...原创 2018-03-11 23:07:10 · 254 阅读 · 0 评论 -
js伪数组转数组、js判断是不是数组
伪数组：具有length属性； 按索引方式存储数据；不具有数组的push()、pop()等方法； 伪数组无法直接调用数组方法或期望length属性有什么特殊的行为，不具有数组的push()、pop()等方法，但仍可以对真正数组遍历方法来遍历它们。常见的伪数组：function内的arguments对象，还有像调用getElementsByTagName, getElementsByC...原创 2018-08-22 15:31:14 · 1143 阅读 · 0 评论 -
【微信小程序】微信小程序入门心得之hello 小程序
1.首先，去微信公众平台（https://mp.weixin.qq.com）注册一个小程序账号2.下载 微信web开发者工具，傻瓜式安装，一路next3.扫码登录 4.新建一个小程序，可以选择一个空目录作为项目目录，微信web开发工具 会自动创建一个类似脚手架的文件，就可以直接开发了。 顺便去注册一个AppID，如果没有的话，可以勾选一个测试账号，如果没有 AppID部...原创 2018-08-08 20:22:11 · 307 阅读 · 0 评论 -
js实现拖拽事件
HTML<body> <div></div></body>CSSdiv{ position: absolute; width: 200px; height: 200px; background: #369 }JSwindow....原创 2018-03-20 16:57:59 · 10070 阅读 · 0 评论 -
js继承之混入式继承
1.运用场景：假设有两个对象o1，o2，如果要把o2的方法和属性拷贝到o1中，混入式继承是最简便的方法之一2.实现方式：用for…in…的方式遍历o2对象的属性和方法，并将o2的属性和方法赋值给o1代码实现function mixExtend( o1, o2 ){ for( var key in o2 ){ o1[key] = o2[key]; }...原创 2018-03-12 18:02:24 · 1251 阅读 · 0 评论 -
JavaScript函数调用的四种方式以及this指向
1.函数调用模式function fn(){ console.log(this); }fn();//输出window2.方法调用模式 var obj = { test:function(){ console.log(this); }}ob...原创 2018-02-25 22:56:12 · 266 阅读 · 0 评论 -
理解JavaScript中的闭包和闭包中的this指向
一． 什么是闭包？闭包是指可以访问另一个函数作用域中变量的函数。在js中，只有函数内部的子函数才能够读取局部变量。因此可以简单地将闭包理解为： 定义在某个函数中的函数。二、闭包原理：上级作用域无法直接访问下级作用域中的变量，但下级作用域可以访问上机作用域中的变量。例如function fn1(){ var n = 100; function fn2(){ ...原创 2018-02-25 23:25:01 · 5750 阅读 · 4 评论 -
JavaScript数组去掉重复数据总结
1.去掉指定的重复数据var arr = [11,22,11,33,33,22,22,44,55];function delRepeat( arr, val ){ for( var i=arr.length-1; i&amp;gt;=0; i-- ){ if( arr[i] === val ){ arr.splice(i, 1...原创 2018-03-10 10:25:42 · 4955 阅读 · 0 评论 -
【前端面试】js的变量提升
1．JavaScript代码执行分为两个阶段：预解析阶段：在预解析阶段，js会对以var声明的变量，和function开头的语句块进行提升，将var声明的变量和function 提升至代码的最前面。需要注意的时，function整体提升，var 声明的变量只提升变量声明，并不会在提升的同时进行赋值操作执行阶段 - 2.举个例子：alert(a)//undefined...原创 2018-02-25 23:15:00 · 357 阅读 · 0 评论 -
使用JavaScript实现递归解决斐波那契数列及优化
递归的概念：若一个算法直接地或间接地调用自己本身，则称这个算法是递归算法(《数据结构—使用C语言实现；朱战立；西安交大出版社》);递归的两个条件：自己调用自己和有结束条件（否则是死递归）斐波那契数列 1, 1, 2,3,5,8,13,21….. 使用公式f( n ) = f(n-1)+f(n-2),结束条件f(2) =1, f(1) = 1function fib(n){ ...原创 2018-02-26 17:57:02 · 5033 阅读 · 0 评论 -
JavaScript的异常处理语句
我们都知道，在某一行代码出现异常后，后续的代码就不执行。这非常让人蛋疼。良好的异常处理机制可以让用户及时得到提醒。从而改正错误。从ES3开始，js也提供了类似的java和C#的异常处理机制，从而让js代码变的更健壮，及时执行的过程中出现了异常，也可以让程序具有了一部分的异常恢复能力。js的异常处理语句基本用法try…catch语句 try{ //可能会出现异常的代码 }原创 2018-01-28 20:22:03 · 1138 阅读 · 0 评论 -
JavaScript实现tab栏
HTML&lt;div id="box"&gt; &lt;ul class="clearfix"&gt; &lt;li class="current"&gt;北京邮电&lt;/li&gt; &am原创 2018-04-01 21:20:39 · 241 阅读 · 0 评论 -
JavaScript简单实现全选反选框
偷个懒~ 样式就不写了，直接上HTML<table> <thead> <tr> <th> <input type="checkbox" id="allOrNot"> <原创 2018-03-28 22:36:02 · 616 阅读 · 0 评论 -
使用JavaScript递归实现汉诺塔问题
啥是汉诺塔？？？？相传在古印度圣庙中，有一种被称为汉诺塔(Hanoi)的游戏。该游戏是在一块铜板装置上，有三根杆(编号A、B、C)，在A杆自下而上、由大到小按顺序放置64个金盘(如下图)。游戏的目标：把A杆上的金盘全部移到C杆上，并仍保持原有顺序叠好。操作规则：每次只能移动一个盘子，并且在移动过程中三根杆上都始终保持大盘在下，小盘在上，操作过程中盘子可以置于A、B、C任一杆上。 三个盘...原创 2018-04-22 22:03:40 · 1449 阅读 · 0 评论 -
js实现快速排序，冒泡排序，选择排序，直接插入排序、希尔排序
1.思想：快速排序应该是最常用的排序算法了。它的时间复杂度比冒泡排序，直接插入排序等低，且它的性能通常比其他的排序算法要好。和归并排序一样，快排也使用了分而治之的思想。将原始数组分为小数组1）首先，选取数组中间元素作为基准点2）创建两个新数组left和right，遍历原始数组，把比中间元素小的元素放在left数组， 把比中间元素大的元素放在right数组3）left数组...原创 2018-08-08 20:04:57 · 367 阅读 · 0 评论 -
【数据结构】JavaScript实现单链表、单链表反转
链表链接也是一种存储数据的工具，不同于数组，链表中的元素并不是连续存储的。因此不能通过下标去访问。 链表分为单(向)链表，双向链表，循环链表等。.今天来实现一下单链表。 单链表中的每个元素包括两个两个域，一个是保存元素本身的域，另一个是指向一下一个节点的指针域 function LinkedList(){ var Node = function( ele ){ ...原创 2018-08-14 16:16:24 · 2783 阅读 · 0 评论 -
【数据结构】JavaScript实现堆栈和队列
栈 ： 又名堆栈，是一种遵循先进后出（LIFO）原则的线性表。只能在一端进行插入和删除操作。这一端被称为栈顶，相对地，把另一端叫做栈底。 向一个栈插入新元素称为压栈，进栈；从一个栈删除元素叫做出栈，弹栈。 比如典型的例子：弹夹创建栈，用一个js构造函数来表示栈 function Stack(){ var items = [] // 判断是不是...原创 2018-08-06 15:55:24 · 230 阅读 · 0 评论 -
浅谈对vue生命周期函数的理解
1.什么是vue生命周期？有什么作用？每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如，需要设置数据监听、编译模板、将实例挂载到 DOM 并在数据变化时更新 DOM 等。同时在这个过程中也会运行一些叫做 生命周期钩子 的函数，这给了用户在不同阶段添加自己的代码的机会。（ps：生命周期钩子就是生命周期函数）例如，如果要通过某些插件操作DOM节点，如想在页面渲染完后弹出广告窗， 那我...原创 2018-08-09 17:43:18 · 2620 阅读 · 0 评论 -
【artTemplate】artTemplate模板引擎入门（二）：原生语法
引入文件 &lt;script src="./template-native.js"&gt;&lt;/script&gt;一.遍历数组html &lt;div id="box"&gt;&lt;/div&gt;配置模板 &lt;scr原创 2018-07-08 23:48:59 · 894 阅读 · 0 评论 -
【artTemplate】artTemplate模板引擎入门（一）：简洁语法的使用
artTemplate 是新一代 javascript 模板引擎，它采用预编译方式让性能有了质的飞跃，并且充分利用 javascript 引擎特性，使得其性能无论在前端还是后端都有极其出色的表现。 可以使用arttemplate.js 简洁语法版arttemplate-native.js 原生语法版（支持js语法）本篇先介绍 简洁语法 版的基本使用1.下载并引入js文...原创 2018-06-14 23:19:20 · 1090 阅读 · 0 评论