2018年03月_VisonYH

原创 JS系列总结笔记——6.深入数组的sort方法

1. sort方法使用说明该方法接收一个函数作为参数，该函数在sort方法内部执行n-1次。该函数的两个参数分别对应数组每次比较的两项。var arr = [2,1,4,3,6,7,5];arr.sort(function(a,b){ console.log(a,b);});执行结果为：正常来说，该方法的排序需要自己传入相应的回调函数。例如实现数字数组的排序函...

2018-03-23 22:02:34 174

原创 JS系列总结笔记——5.深入理解call、apply、bind方法

1. call方法的作用说明：在js中所有的函数都是Function的实例，而且对于Function来说，它的原型即Function.prototype中含有很多东西，其中call,apply和bind方法就是Function原型中的方法，所以根据原型的规则，所有的函数都可以使用原型中属性和方法，所以来说，对于所有的函数都可以使用call、apply、bind方法。作用：而在JavaScr...

2018-03-22 18:16:32 195

原创 JS系列总结笔记——4.JS继承

1.类式继承// 父类var SuperClass = function() { this.superValue = true;}// 子类var SubClass = function() { this.subValue = false;}SubClass.prototype = new SuperClass(); // 原型指向父类的实例，即可继承父类的...

2018-03-21 22:02:50 107

原创 JS系列总结笔记——3. 深入理解JS中的this

1. 定义JS中的this代表的是当前行为执行的主体，context指的是当前行为执行的环境（区域）。例如：我在餐厅吃饭和我在食堂吃饭，this都是我，改变的是执行环境。2.判断this到底是谁函数执行，首先看执行时函数名前是否有 “ . ”，有的话前面是谁this就是谁，没有的话this就是window。function fn() {console.log(t...

2018-03-21 10:51:10 172

原创 JS系列总结笔记——2. JavaScript函数执行内部原理

1. 函数执行的步骤JavaScript函数执行时的步骤如下： (1) 形成新的私有作用域； (2) 如果有形参，先给形参赋值； (3) 进行私有作用域中的预解释（预解释原理）； (4) 私有作用域中的代码从上到下执行。2. 区分私有变量和全局变量全局变量：在全局（window）下声明的变量即全局变量；私有变量：在JavaScript（不包含es6）函数内部声明的变...

2018-03-21 10:22:05 449

原创 JS系列总结笔记——1. JavaScript的预解释机制（变量提升）

1. 概念当浏览器加载HTML页面时，会先提供一个供全局JS代码执行的环境（即全局作用域，window或者global），在这个环境中，浏览器默认会把所有带var和function的变量进行提前声明或者定义。 (1) 理解声明和定义；var num = 12;// 声明：告诉浏览器在全局作用域中有一个num变量// 定义：给变量进行赋值// 使用只声明未定义的变量值为und...

2018-03-20 20:05:21 199

转载设备像素比、DPI、PPI、DP、PX 的详细计算方法

参考地址： https://www.web-tinker.com/article/20590.html https://www.zhihu.com/question/21220154

2018-03-20 14:25:03 2721

转载 transform transform-origin详解

mark一下这两篇文章，有时间再好好总结。 https://www.w3cplus.com/content/css3-transformhttp://www.zhangxinxu.com/wordpress/2012/09/css3-3d-transform-perspective-animate-transition/

2018-03-19 15:16:42 1140

原创 word-wrap white-space word-break textoverflow的辨析

1. word-wrap属性值： normal（默认属性）、break-word 说明：正常来说，在一行文本中，如果出现这一行已经放不下的单词，浏览器会自动将该文字转入下一行。但是，如果一行都无法放下该单词，则浏览器默认会出现溢出的情况。如果设置了break-word属性，则会将该单词折断在下一行显示。 2.white-space 属性说明：规定段落中的文本不进行换行。属性值：...

2018-03-18 14:49:12 250

原创模拟单选框或复选框

1. 原生的input似乎有点丑，可以利用CSS属性选择器选择不同的状态，模拟出相应的效果。HTML代码如下：<label for="test"> <input id="test" type="checkbox"> <span></span></label>CSS代码如下：

2018-03-18 14:09:01 470

原创 HTML5 input常见新增类型及属性

1. url类型、email、tel类型说明：当输入非url、email的字符串时，浏览器会自动提醒。<form action="/example/html5/demo_form.asp"> <input type="url"> <input type="submit" value="提交"></form&

2018-03-17 10:44:40 3913

VisonYH的博客