4 Jacky-Summer

尚未进行身份认证

我要认证

不是因为看到希望才去努力,而是努力后才会看到希望!

等级
TA的排名 3w+

深入理解JavaScript之作用域链与闭包

作用域作用域是指程序源代码中定义变量的区域。实际上描述的就是查找变量的范围,作用域必须有的两个功能就是存储变量以及查找变量,作用域就是发挥这两个作用以及更多作用的规则。作用域规定了如何查找变量,也就是确定当前执行代码对变量的访问权限。词法作用域和动态作用域词法作用域:(静态作用域)函数的作用域在函数定义的时候就决定了。动态作用域:函数的作用域是在函数调用的时候才决定的。JavaS...

2020-03-01 22:44:44

深入理解JavaScript之 new 原理及模拟实现

1.定义new 运算符创建一个用户定义的对象类型的实例或具有构造函数的内置对象的实例先看看 new 实现了哪些功能, 先来看一段代码:function Person(age) { this.age = age;}Person.prototype.getAge = function() { console.log("年龄为:" + this.age );}var pe...

2020-02-22 21:49:06

深入理解JavaScript之原型与原型链

1.原型prototype原型是一个对象,把prototype称为原型对象,prototype可以让所有的对象实例共享它包含的属性和方法。JavaScript规定,每一个函数都有一个prototype对象属性,指向另一个对象。prototype对象属性的所有属性和方法都会被构造函数的实例继承。2.只有函数有prototype属性js分为函数对象和普通对象,每个对象都有__proto__属性...

2020-02-16 11:44:41

ES6系列之一文彻底弄懂Iterator

前言本文主要来深入剖析ES6的Iterator(迭代器/遍历器),在了解它之前,我们首先要知道为什么需要Iterator? 它出现的原因是什么?从循环说起平时开发中,我们经常会用到循环,拿最基本的来说,比如循环一个数组:// for循环var arr = [1, 2, 3, 4];for(let i = 0; i < arr.length; i++) { console....

2020-01-11 09:47:51

ES6系列之箭头函数全解析

引言ES6中允许使用箭头=>来定义箭头函数,是ES6中较受欢迎也较常使用的新增特性。本文将从箭头函数的基本语法,与普通函数对比,箭头函数不适用场景三个方面进行梳理。基本语法// 箭头函数let func = (name) => { // 函数体 return `Hello ${name}`;};// 等同于let func = function (nam...

2020-01-07 20:42:28

ES6系列之模板字符串

模板字符串是ES6中非常重要的一个新特性,这个特性使得处理相关业务变得更加容易。基础用法let a = `hello world`;console.log(a); // hello world注意这里不是双引号,而是反撇号`在模板字符串中,还可以拼接html元素,同时空格、缩进、换行都会被保留,并且如果模板字符串中的变量没有声明,将报错。let str = ` <div...

2020-01-05 23:44:16

ES6系列之变量的解构赋值

1.什么是解构?ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构。它在语法上比ES5所提供的更加简洁、紧凑、清晰。它不仅能减少你的代码量,还能从根本上改变你的编码方式。2.数组解构以前,为变量赋值,我们只能直接指定值,比如let a = 1;let b = 2; let c = 3;现在可以用数组解构的方式来进行赋值let [a, b, c] = [1,...

2020-01-05 09:57:49

Vue实现星级评价效果

我们把星级评价单独做成一个Star组件,抽离出来,其中父组件中引入(传入的是评分的值)<div class="score"> <Star :score="poiInfo.wm_poi_score"></Star></div>初始Star.vue<template> <div> <div ...

2019-12-29 21:33:22

ES6系列之let和const与var的区别

ES6规范新增了let、const两种变量声明方式,项目中也经常要用到,今天借着温习ES6语法,来总结let 、const、var的区别。一、变量提升来看下面三段代码console.log(a); // undefinedvar a = 2;console.log(b); // Uncaught ReferenceError: b is not definedlet b = 2;...

2019-12-28 17:47:25

swiper父级元素处于隐藏状态滚动效果失效问题

在使用vue-awesome-swiper的时候,实现这样一个功能, 点击页面的banner图(Banner.vue),进入一个图片画廊(Gallary.vue),可以查看更多相关的照片,但发现轮播图滚动效果失效原因是:一开始Gallay.vue的所有用swiper控制的图片处于隐藏状态,直到点击才进入图片画廊显示图片。swiper其父级元素处于隐藏状态(display:none), 会导致s...

2019-12-25 09:50:18

vue-awesome-swiper修改轮播图pagination的颜色

在使用vue-awsome-swiper轮播图的时候,pagination处于当前选中状态默认是蓝色,但通过修改这个类并无法改变其背景颜色<div class="wrapper"> <swiper :options="swiperOption"> <swiper-slide v-for="(item, index) of swiperList...

2019-12-25 09:48:26

CSS查漏补缺(二)——自定义checkbox样式

由于原生的checkbox样式比较难看,所以我们经常需要改写它的样式,美化复选框,所以今天总结下自定义checkbox样式的方法,上代码:html部分<label class="checkbox-inline"> <input type="checkbox" class="checkbox" name="hobby"> <span class="h...

2019-12-25 09:47:13

CSS查漏补缺(一)—页面内容不足铺满屏幕高度和有滚动条时,footer始终保持底部显示

记录一个项目中经常会用到的技巧,footer区(比如版权信息)要始终居于页面底部。如果用fixed定位显然不可取,因为要保证页面高度大于屏幕高度时,footer区要跟随着页面滚动保持在底部,如下图:tip:以下两个方法仅适用于footer区高度固定的情况方法一页面结构:<div class="wrapper"> <div class="main-conta...

2019-12-07 23:56:25

深入理解JavaScript之执行上下文和变量对象

继续接着上篇文章,上篇我们说到函数上下文的结构可表示为const ExecutionContextObj = { VO: window, // 变量对象 ScopeChain: {}, // 作用域链 this: window};即每个函数上下文,都要有这三个重要属性:变量对象(Variable object, VO)作用域链(Scope chain)...

2019-11-28 21:20:33

深入理解JavaScript之执行上下文和执行栈

都说想成为出色的JavaScript 开发者,就要深入学习 JavaScript 程序内部的执行机制,最近学了一遍JS的执行上下文和执行栈,以此作总结。首先先来了解几个专业概念EC:函数执行环境(或执行上下文),Execution ContextECS:执行环境栈,Execution Context StackVO:变量对象,Variable ObjectAO:活动对象,...

2019-11-27 23:54:50

深入理解JavaScript之实现继承的7种方式

1.原型链继承核心:将父类的实例作为子类的原型首先,要知道构造函数、原型和实例之间的关系:构造函数都有一个原型对象,原型对象都包含一个指向构造函数的指针,而实例都包含一个原型对象的指针。function Father(){ this.name = '父类的名字';} Father.prototype.getFatherName = function(){ consol...

2019-11-23 17:52:28

移动端之开启和禁止页面滚动

在做移动端页面是,有个操作需要禁止页面的滚动,故学习了原生js的操作function handler(ev){ ev.preventDefault();}// 禁止页面滚动document.body.addEventListener('touchmove', handler, { passive: false });passive:false。 设置该属性的目的主要是为了在阻...

2019-11-10 23:33:50

sessionStorage、localStorage用法总结

在工作中使用sessionStorage存储数据时,发现sessionStorage无法直接存储数组和对象,如存入对象则显示为"[object Object]",对此作下记录,重新温习sessionStorage和localStoragehtml5 中的 web Storage 包括了两种存储方式:sessionStorage 和 localStorage共同点存储大小为5MB,都保存在客户...

2019-11-03 23:04:08

jquery源码分析(一)

最近开始阅读jquery的源码,首先先提炼出jquery的核心结构。自执行函数(function(window,undefined){ //...})(window);为什么传入window?1.代码压缩首先从代码压缩混淆的角度考虑,用线上工具来压缩混淆下面这段示例代码:function test(){ var name="hello"; window.descri...

2019-09-07 15:30:32

深入理解JavaScript(三):获取数组中的最大值方法(this,apply)

1.排序法思路:给数组先排序(由大到小排序),第一项就是最大值let arr = [1,5,6,7,9,20,40,2,3];let max1 = arr.sort(function(a,b){ return b-a;})[0];console.log(max1);2.假设法思路:假设第一个值是最大值,依次遍历数组中后面的每一项,和假设的值进行比较,如果比假设的值要大,把当...

2019-08-11 13:51:01

查看更多

勋章 我的勋章
  • 持之以恒
    持之以恒
    授予每个自然月内发布4篇或4篇以上原创或翻译IT博文的用户。不积跬步无以至千里,不积小流无以成江海,程序人生的精彩需要坚持不懈地积累!
  • 勤写标兵Lv2
    勤写标兵Lv2
    授予每个自然周发布4篇到6篇原创IT博文的用户。本勋章将于次周周三上午根据用户上周的博文发布情况由系统自动颁发。