- 博客(56)
- 收藏
- 关注
RSS订阅原创 1.1 Javascript的灵活性
JavaScript的灵活性本文是记录读JavaScript设计模式第一章的读书笔记首先从一个开始动画、停止动画的实现说起，最平常的实现如下function startAnimation(){}function stopAnimation(){}// 这种写法简单明了，需要执行什么操作就调用什么函数，但是有个缺点是：无法创建可以保存动画相关的状态并且具有一些操作动画内部状态的方...
2018-09-04 22:33:47
245
原创 vue之v-if和if-show
本文参考了vuejs的官方文档，结合自己的理解整理而成的读书笔记！在 元素上使用 v-if 条件渲染分组当一个v-if指令控制一组html标签显示与隐藏时，可以借助不可见的包裹元素来作为这一组html标签的父元素，然后将v-if指令嵌入<template v-if="ok"> <h1>Title</h1> <p>Paragr...
2018-07-15 22:54:46
1078
原创 vue的class与style
本文参考了vuejs的官方文档，结合自己的理解整理而成的读书笔记！ 将 v-bind 用于 class 和 style 时，表达式结果的类型除了字符串之外，还可以是对象或数组对象语法<div class="static" v-bind:class="{ active: isActive, 'text-danger': hasError }"><...
2018-07-15 21:48:56
460
原创 vue基础知识系列
本文参考了vuejs的官方文档，结合自己的理解整理而成的读书笔记！声明式渲染vuejs响应式的将data里声明的数据和Dom建立联系，可以非常方便的设置和获取Dom对象绑定的值&lt;div id="app"&gt; &lt;p&gt;{{ message }}&lt;/p&gt; // v-bind将html原生属性title和message变量绑定
2018-07-14 23:38:01
805
原创 JavaScript不清不楚之Function构造器
Function 使用Function构造器生成的函数，并不会在创建它们的上下文中创建闭包；它们一般在全局作用域中被创建。当运行这些函数的时候，它们只能访问自己的本地变量和全局变量，不能访问Function构造器被调用生成的上下文的作用域// 1、f()函数返回的function e()是闭包.var n = 1;function f(){ var n = 2; ...
2018-07-08 21:41:58
390
原创 JavaScript不清不楚之join、toLocaleString、toString
Array.prototype.join以下代码均来自：MDN join方法将数组（类数组对象）按照传入的字符将其所有的元素连接成一个字符串并返回该字符串 join方法不会改变原数组 如果没有参数，默认分隔符为”，” 如果数组里的元素项是undefined或者null会转换为空字符串 //类数组function f(a, b, c) { var s...
2018-07-04 23:13:52
249
原创 JavaScript不清不楚之includes、indexOf、lastIndexOf
Array.prototype.includes以下代码均来自：MDN includes判断一个数组是否包含某个元素，找到返回true，否则返回false，默认从0开始查找，如果传入的索引值大于等于数组长度则不会遍历数组，直接返回false IE系列不支持 // https://tc39.github.io/ecma262/#sec-array.prototype....
2018-07-04 23:01:53
419
原创 JavaScript不清不楚之entries、keys、values
Array.prototype.entries以下代码均来自：MDN entries方法返回一个新的Array Iterator对象，每个元素项是包含数组中每个索引的键/值对 IE系列不支持 var arr = ["a", "b", "c"];var iter = arr.entries();var res = [];for(var i=0; i< a...
2018-07-04 22:09:41
508
原创 JavaScript不清不楚之slice、splice
Array.prototype.slice以下代码均来自：MDN slice 不修改原数组，只会返回一个浅复制了原数组中的元素的一个新数组 如果原数组里有引用类型的项，则修改新数组会影响原数组 /** * Shim for "fixing" IE's lack of support (IE < 9) for applying slice * on host...
2018-07-04 16:56:37
138
原创 JavaScript不清不楚之遍历
Array.prototype.every以下代码均来自：MDN every函数测试数组的每一个元素是否通过测试，此方法并不一定会遍历全部的元素，它的执行机制是遇到未通过测试的项则立即返回false，如果全部通过测试则返回true every函数并不改变原数组 空数组对任何检测回调函数都返回true(空数组中所有元素都符合给定的条件，注：因为空数组没有元素) 这个解...
2018-07-03 20:27:49
191
原创 JavaScript不清不楚之copyWithin
Array.prototype.copyWithin代码均来自：MDNif (!Array.prototype.copyWithin) { Array.prototype.copyWithin = function(target, start/*, end*/) { // Steps 1-2. //过滤null和undefined eg: Array.prototyp...
2018-07-02 23:06:16
306
原创 Javascript不清不楚之concat
Array.concat代码均来自：MDN 此方法用来合并多个数组，不会改变原有的数组，返回一个新的数组（根据提供的数组做浅拷贝生成新数组） 注意：数组/值在连接时保持不变。此外，对于新数组的任何操作（仅当元素不是对象引用时）都不会对原始数组产生影响，反之亦然多个值或者数组合并var arr = [1, 2, 3];var res = arr.concat(4, ...
2018-07-02 15:57:59
109
原创 JavaScript不清不楚之Array.of
Array.of代码均来自：MDNif (!Array.of) { Array.of = function() { //利用arguments的类数组特性，利用slice方法返回一个新数组 return Array.prototype.slice.call(arguments); };}与new Array()的区别var arr1 = new...
2018-07-02 14:42:02
118
原创 JavaScript不清不楚之Array.isArray
Array.isArray代码均来自：MDN//利用Object.prototype.toString实现类型判断if (!Array.isArray) { Array.isArray = function(arg) { return Object.prototype.toString.call(arg) === '[object Array]'; };}Ar...
2018-07-01 18:51:57
1017
原创 JavaScript不清不楚之Array.from
代码均来自：MDNArray.from(arrayLike[, mapFn[, thisArg]]) 根据一个类数组或者可迭代对象创建数组实例// Production steps of ECMA-262, Edition 6, 22.1.2.1// Reference: https://people.mozilla.org/~jorendorff/es6-draft.html...
2018-07-01 18:33:22
180
原创 5.2.5 JavaScript之Array排序
Array排序sort 默认是升序排列（会改变原数组）var arr = [0, 1, 15, 132, 5, 7, 55, 521];console.log(arr.sort()); // [0, 1, 132, 15, 5, 521, 55, 7]//sort()方法的排序默认是对每个元素调用toString()方法然后比较字符大小然后进行排序//让sort函数按照数...
2018-07-01 17:21:13
125
原创 5.2.4 JavaScript之Array队列方法
Array的队列方法队列方法均会改变原数组unshift队头插入（返回数组长度）var arr = [2];var res = arr.push(3);console.log(arr); // [2,3]console.log(res); // 2res = arr.unshift(1);console.log(arr); // [1,2,3]console...
2018-07-01 16:41:53
176
原创 5.2.3 JavaScript之Array栈方法
Array栈方法push 入栈（返回值是数组的长度）//在数组末尾添加元素var arr = [1, 2, 3];var res = arr.push(4, 5);console.log(arr); // [1,2,3,4,5]console.log(res); // arr.length 5res = arr.push([6, 7]);consol...
2018-07-01 16:32:50
129
原创 5.2.2 JavaScript之数组转换
数组转换 任何对象都有toLocaleString(), toString(), valueOf()方法，实现在Object对象的原型对象上var arr = ["a", "b", "c"];alert(arr); // 默认调用了toString()方法alert(arr.toString());alert(arr.toLocale...
2018-07-01 15:55:07
96
原创 5.2.1 JavaScript之数组检测
数组类型检测instanceofvar arr = new Array();if(arr instanceof Array){ console.log(true)} instanceof 的问题在于，如果网页脚本包含多个框架，有多个版本的数组构造函数，如果从一个框架箱另一个框架传递数组，这时候instanceof检测数组会有问题Array.isArray...
2018-07-01 15:28:58
96
原创 5.2 JavaScript之Array
Array类型Array类型的变量的长度是可以动态改变的，存储的元素类型也不需要完全一致Array类型变量的创建方法:new操作符//创建一个空数组var arr1 = new Array();//创建一个指定初始长度的数组var arr2 = new Array(20);//创建指定初始元素的数组var arr3 = new Array(1, 2, 3);...
2018-07-01 14:48:03
86
原创 5.1 JavaScript之Object
Object类型创建Object实例的两种方法：new操作符var obj1 = new Object();字面量表示法var obj2 = { name: "dao-keer", age: "18" // 最后一个属性的值后面不需要加逗号，如果加了在IE7以下版本和opera低版本会报错}; 函数参数传递模式最好的用法是对于必...
2018-07-01 14:25:18
96
原创 4.3 Javascript之垃圾回收
JavaScript的垃圾回收 JavaScript具有自动垃圾回收机制，垃圾回收器会周期性的检测程序中不再使用的变量，并自动回收释放其占用的内存垃圾回收策略标记清除标记清除的策略：当执行流进入某个作用域时，会将这个作用域里所有的变量打上将被使用的标记，意味着这些变量很可能会被使用，是不能被释放回收的，当执行流离开这个作用域时，便将不会被使用的变量打上相应标记，等待垃圾回...
2018-07-01 01:36:55
161
原创 Javascript不清不楚之reduce
reduce下面这段代码实现来自：MDN - reduce// Production steps of ECMA-262, Edition 5, 15.4.4.21// Reference: http://es5.github.io/#x15.4.4.21// https://tc39.github.io/ecma262/#sec-array.prototype.reduceif (...
2018-06-30 22:43:24
135
原创 vue工具函数阅读
vue2工具函数阅读变量类型检测/** * Get the raw type string of a value e.g. [object Object] */function toRawType (value) { return Object.prototype.toString.call(value).slice(8, -1)}/** * Strict objec...
2018-06-30 15:25:22
585
原创 ES6基础
箭头函数和thisvar bob = { _name: &amp;quot;bob&amp;quot;, _friends: [&amp;quot;a&amp;quot;, &amp;quot;b&amp;quot;], printFriends(){ this._friends.forEach(f =&amp;amp;gt;{
2018-06-15 16:00:13
98
原创 jquery加载运行环境
jquery的加载运行环境开发环境下jquery3.3.1的代码结构如下所示：( function( global, factory ) { &quot;use strict&quot;; if ( typeof module === &quot;object&quot; &amp;amp;&amp;amp; typeof module.exports === &quo
2018-05-30 23:05:18
1359
原创 读JavaScript设计模式之简单工厂模式有感
简单工厂模式本文是记录读JavaScript设计模式之简单工厂模式的笔记简单工厂模式：通常是使用一个函数，通过传递的参数来生成指定的类的实例来达到批量生成相似的对象function createShape(name){ var res = {}; switch(name){ case "rectangle": res = ne...
2018-03-20 15:01:34
122
原创 读JavaScript多重继承多态有感
继承本文记录了JavaScript的多重继承代码，摘录自JavaScript设计模式Object.prototype.mix = function(){ var temp; for(var i = 0, len = arguments.length; i < len; i++){ temp = arguments[i]; for(v...
2018-03-19 22:12:09
155
原创 读JavaScript继承有感
继承本文是在读了JavaScript设计模式的继承部分做的总结类式继承function Father(firstName){ this.firstName = firstName; this.family = ["father", "mother", "son"];}Father.prototype.showFirstName = function(){...
2018-03-18 23:14:18
173
原创 读jJavascript封装有感
封装本文是在读JavaScript设计模式之封装之后的感悟篇function Person(name, age){ this.name = name; this.age = age;}Person.prototype = { showName: function(){ console.log(this.name) }}var ...
2018-03-16 17:51:57
194
原创 4.2 Javascript之执行环境和作用域
执行环境 每个执行环境都有一个与之关联的变量对象，环境中定义的所有变量和函数都保存在这个对象中。 //书中说我们自己编写的代码无法访问这个对象 //下面这个最外层的执行环境window对象是可以访问的呢？？？ web浏览器中，最外层的执行环境是window对象，因此所有的全局变量和函数都是作为window的属性或者方法创建的作用域链 作用域链的用途是保证执行...
2018-03-15 21:31:10
286
原创 4.1 Javascript之基本类型和引用类型
动态的属性var testObj = {};testObj.name = "ccc";console.log(testObj.name); // "ccc" //如果对象不被销毁或者name属性不被删除，可以一直访问到该属性//不推荐给基本类型的变量增加动态属性，严格模式下会报错复制变量值var num1 = 3;var num2 = num1;//这里用num1...
2018-03-14 21:22:30
85
原创 3.7 JavaScript之函数
参数在js的函数中，调用函数所传的形参个数不一定非要跟函数定义的形参个数保持一致，因为传进来的参数在函数体里面可以用arguments这个类数组的对象获取到，arguments[0]对应第一个形参，以此类推，arguments有length属性可以知道传进来的形参的个数function add(num1, num2){ if(arguments.length === 1){ ...
2018-03-13 22:39:20
111
原创 3.6 Javascript之语句
do-while这个循环语句的特点是：循环体会无条件的执行一次for-in这个循环语句主要用来遍历对象里的所有可枚举的属性（无顺序）switchswitch语句再比较值时使用的时全等操作符，不会发生类型转换...
2018-03-12 20:30:40
93
原创 3.5.7 Javascript之相等操作符
相等和不相等相等（==）和不相等（！=）在比较的时候都会先转换操作数然后再判断相等性console.log("a" == 97); // false "a"会先转换为数值再比较，NaNconsole.log(false == 0); // true false会先转换为0再比较console.log(null == undefined); // true全等和不全等...
2018-03-12 20:08:04
103
原创 3.5.6 Javascript之关系操作符
关系操作符//都是数值console.log(5 > 2); // true//如果都是字符串，则挨个比较对应字符的编码值console.log("a" > "c"); // falseconsole.log("23" > "3"); // false//如果一个是数值，另一个是非数值则转换为数值再比较console.log(4 > "a&qu
2018-03-12 19:58:13
89
原创 3.5.5 Javascript之加性操作符
加法//列举比较特殊的console.log(Infinity + (-Infinity)); // NaNconsole.log(NaN + "abc"); // "NaNabc"//如果有一个操作数是字符串，就将另一个不是字符串的值调用toString()方法转换为字符串然后拼接减法//列举比较特殊的console.log(-Infinity - Infinity));...
2018-03-12 19:45:38
121
原创 3.5.4 Javascript之乘性操作符
乘性操作符乘法乘法需要遵循的特殊规则：如果都是数值，则正常计算如果有一个操作数是NaN，结果一定是NaNInfinity乘以0，结果是NaNInfinity乘以非0的数，结果是Infinity或者-InfinityInfinity自身相乘等于自身如果操作数不是数值，则隐式调用Number()转换为数值再进行计算除法console.log(10 / 5); ...
2018-03-12 19:25:11
160
原创 3.5.3 JavaScript之布尔操作符
布尔操作符布尔操作符有：与（&&）、或（||）、非（！）逻辑非逻辑非操作符可用于ECMAScript中的所有值，遵循以下规则：如果操作数是一个对象(包括空对象)，返回false如果操作数是一个空字符串，返回true，否则返回false如果操作数是数值0或者NaN，返回true，其它均返回false如果操作数是null或者undefined，返回true...
2018-03-10 22:51:37
99
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人