自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(19)
  • 收藏
  • 关注

原创 javascript表单三级联动

页面结构<form action=""> <select name="" id="provice"> </select> <select name="" id="city"></select> <select name="" id="region"></select></form>数据结构var area = { '河南省': [{

2021-01-18 21:31:27 1068

原创 数组去重的多重封装方法

利用for循环Array.prototype.uniq = function(){ var resArr = []; var flag = true; for(var i = 0; i < this.length; i++){ if(rhis[i] != this[i]){//排除NaN if(flag){ resArr.push(this[i]); flag = false;

2020-12-28 20:21:51 234

原创 合并数组的多种方法

利用concatfunction concat(arr1,arr2){ return arr1,concat(arr2);}利用slice+push.applyfunction concat(arr1,arr2){ var newArr = arr1.sliice(0); [].push.apply(newArr,arr2); return newArr;}利用slice + pushfunction concat(arr1,arr2){ var n

2020-12-20 07:14:43 9320 2

原创 删除数组第一个元素并封装

利用slicefunction cur(arr){ return arr.slice(1);}利用filterfunction cur(arr){ return arr.filter(function(a,b){ return b !== 0; });}利用push.apply+shiftfunction cur(arr){ var newArr = []; [].push.apply(newArr,arr); newArr.

2020-12-19 21:54:36 158 1

原创 给数组元素头部添加一个元素的多种方法

利用concatfunction pre(arr, item) { return [item].concat(arr); }使用push.applyfunction pre(arr, item) { var newArr = [item]; [].push.apply(newArr, arr); return newArr;}利用slice+unshift/splicefunction pre(arr, item) { var newArr

2020-12-19 19:20:50 3821 1

原创 封装删除数组最后一个元素的多种方法

slice +popfunction foo(arr){ var res = arr.slice(0); res.pop(); return res;}利用slicefunction foo(arr) { return arr.slice(0, -1);}function foo(arr) { return arr2 = arr.slice(0, arr.length - 1);}利用filterfunction foo(arr)

2020-12-19 14:32:38 161 1

原创 封装数组求和的多种方法

利用for循环封装function foo(array){ var cont = 0; for(var i = 0;i<array.length;i++){ cont += arr[i]; } return cont;}function foo(arr){ var cont = 0; for(var i = arr.length;i>=0; i--){ cont += arr[i]; }

2020-12-19 11:08:36 718 1

原创 深入了解作用域链,明白作用域链的使用过程

js深入系列之作用域链当查找变量的时候,会先从当前上下文的变量对象中查找,如果没有找到,就会从父级(词法层面上的父级)执行上下文的变量对象中查找,一直找到全局上下文的变量对象,也就是全局对象。这样由多个执行上下文的变量对象构成的链表就叫做作用域链。下面,让我们以一个函数的创建和激活两个时期来讲解作用域链是如何创建和变化的。函数创建在《JavaScript深入之词法作用域和动态作用域》中讲到,函数的作用域在函数定义的时候就决定了。这是因为函数有一个内部属性 [[scope]],当函数创建的

2020-12-16 23:27:26 204

原创 模拟spliceAPI并封装

ellostr_splice("hello", 0, 1); //ello var str = "hello"; var res = str_splice(str, 0, 1); function str_splice(str, index, len) { var parms = [...arguments]; var res = ""; str = str.split("");

2020-12-16 23:05:31 129

原创 什么是作用域,带你认识作用域

作用域[[scope]]每个javascript函数都是一个对象,对象中有些属性我们可以访问,但有些不可以,这些属性仅供javascript引擎存取,[[scope]]就是其中一个。**[[scope]]**指的就是我们所说的作用域,其中存储了运行期上下文的集合。作用域链:[[scope]]中所存储的执行器上下文对象的集合,就是这个集合呈链式链接,我们把这种链式叫做作用域链运行期上下文:当函数执行时,会创建一个成为执行期上下文的内部对象,一个执行期上下文定义了一个函数执行时的环境,函数每次执行时对应

2020-12-15 21:18:13 1430

原创 数组及对象的深拷贝与浅拷贝

深拷贝拷贝后,一个变量发生变化不会影响另一个数据var a = 123;var b = a; b = 'new str';console.log(a,b);浅拷贝任意一个发生改变另一个也会发生改变var arr = [1];var copy_arr = arr; copy_arr.push("new string"); arr.push("new string"); console.log(arr); console.log(copy_arr);内存分为 栈 和 堆

2020-12-10 21:36:49 171

原创 了解函数,并使用函数

什么是函数function 定义函数foo 函数名 自定义a b 形参,形参可以为多个函数定义阶段中的代码是不会执行的function foo(a, b) { //方法体 // 形参的作用:接收实参,意义对应的关系, // 如果没有传递实参 那么曾灿的值为undefined console.log('hellow wor'); console.log(a);

2020-12-10 21:05:10 157

原创 了解switch case,break,continue

switch caseswitch里面放的是条件,case里面是判断,但是switch也存在一个bug:当它找到满足要求的条件时,后面的语句尽管不判断了,他也会把语句解释出来如下:var n = “a”;switch(n){ case "a": console.log('a'); case 2: console.log('b'); case true: console.log('c')}//===>abc解决方案:var

2020-12-10 20:42:52 558

原创 JavaScript中关于对象的使用

对象创建如何创建对象1:直接写2:构造函数new 关键字;作用:实例化对象object 内容api 作用构造对象var obj ={ a:'a' } obj.b='b'; var obj1 = new Object(); console.log(obj1); console.log(obj,'=====obj'); obj1.a='a';//新增 obj

2020-12-04 21:36:14 92

原创 教你如何从数组中取值

数组的特点1:数组有索引值 0 1 2 32:数组有长度,表示数组中元素的个数3;数组结构,虽然可以存放任意类型的js数据,但是一般存放统一类型数据。规则:数组内部的数据结构必须统一,特殊情况除外 var arr = ['11', '22', '33'] var stu = [ { name: 'cieci', age: 12, dec: '无敌' }, { name: 'cieci', age: 12, dec: '无敌' },

2020-12-04 21:19:04 29288

原创 条件语句的使用

认识if语句所有的条件语句都是同步代码if关键字表示如果()条件表达式{ }只有( )是true或者表达式的返回值为true才会只给你{ }代码if(true){ console.log('执行if条件语句')}条件表达式,需要根据条件去查找else的作用else是配合if一起使用的,当除了if语句的条件之外,出现的其他条件,else相当于if的补充条件if(false){//如果满足条件时执行 console.log('满足条件'); }else{//不满足上面的条

2020-12-03 23:39:14 234

原创 如何实现一个转动的太极图

在实现太极图之前我们要先了解一下关于2D旋转和过渡的知识什么是过渡过渡指的是从一种样式逐渐改变为另一种样式的效果。必须规定两项内容:1.指定要添加效果的css样式。2.指定效果的持续时间。transition:width 2s;transition:css属性 过渡时间 过渡速度 延迟时间;用于对一个属性中设置一个过渡效果。注意:添加多个过渡效果可以使用逗号隔开。transition-property:width;规定应用过渡的css属性名称值:需要过渡的属性名称。all:所有non

2020-11-24 22:27:06 828

原创 用html实现电子时钟

如何实现电子时钟###了解动画在实现电子时钟前一定要了解动画的基础知识,这样写一个电子时钟那就是水到渠成animation-name:;创建动画名@keyframes:创建动画,创建关键帧动画内部使用百分比设置关键帧,每个关键帧中都要设置一个相同的样式@keyframes move{0%{}动画开始的状态100%{}动画结束状态注意:初始状态和结束状态的属性一定要保持一致,否则,不能实现动画效果}animation-duration:;设置动画的持续时间,单位:秒/sanimatio

2020-11-24 22:03:54 3713

原创 如何利用html3D想过实现正方体

3D 图形转换transform-style:preserve-3d;主要是将二维转换为三维,通俗的将就是将一个平面转换成一个有立体感的事物,而它的默认值为2D平面内backface-visibility:hidden;3D透视下,默认可以通过背面看到正面的内容,可根据需要设置不可见。perspective:2000px;设置透视距离,即观察者距离平面【z=0】的距离,让元素行程透视效果,不允许负值;当元素定义perspective属性时,其子元素会获得透视效果,而不是元素本身。注意:与perspe

2020-11-24 21:38:42 332

空空如也

空空如也

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

TA关注的人

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