qs8lk88-CSDN博客

原创 Vue源码学习（一）env.js

Vue框架中，util目录下的env.js，主要内容是做项目运行环境的检测和部分兼容处理。Vue框架中使用了facebook的flow框架，来提升开发效率。具体笔记如下：// @flow// 是否能够使用__proto__ 代表原型对象export const hasProto = '__proto__' in {};// 检查运行环境是否是浏览器，如果是，检查是哪个

2018-01-26 23:50:53 3055

原创浅谈JavaScript函数中的Arguments对象

arguments对象是所有（非箭头）函数中都有的局部变量（内置属性）。用来引用函数中的参数。arguments对象有length属性，也可以用方括号（[]）来访问第X个参数。function demo1(a1,a2,a3){ var param1 = arguments[1]; //这相当于 var param1 = a1; result arguments.length;}

2018-01-18 14:06:17 250

原创浅谈 webpack中基本的四个概念

webpack是一款JavaScript程序的打包器。在写JavaScript程序的时候，webpack将根据工程中各个模块的依赖关系，生成一个依赖关系的图，然后按照“依赖关系图”（dependency graph）把这些模块打包成“捆”（bundle），由浏览器加载bunlde，渲染页面。入口起点（Entry）所谓入口就是工程开始时的第一个（多个）要运行的脚本文件，通常它是依赖

2018-01-17 16:12:36 898

原创 JavaScript中面向对象——类的封装（一）

JavaScript本身并不是一种“面向对象”的语言（它是“基于对象”的），但它可以凭借自身的灵活性，用开发技巧，模仿出“面向对象”语言的效果。在ES6中标准中，将这种“技巧”规范化成了class 关键字。之前我们谈过new运算符，知道它的作用是：“实例化构造函数，以提供‘批量’生成某‘类’对象的手段”。//用构造函数，模拟"类"这一概念function People(name =

2018-01-17 14:44:04 1506

原创浅谈JavaScript中的new运算符

所谓new运算符，即是在JavaScript中，命令构造函数，生成实例对象的“运算符”。其基本的语法是new constructor[(arguments)], 其中constructor表示构造函数，arguments表示对象。// 构造函数A function A(name){ this.name = name; }//实例化构造函数A var person = new A

2018-01-16 20:39:40 264

原创浅谈ES6中的箭头函数

ES6中提出了一个新的概念，叫做箭头函数。我们可以把这个概念，理解成一个“简化版”的函数。之所以说箭头函数是所谓的“简化版”，主要原因有二，其一是箭头函数的写法比较简单，其二是箭头函数缺少Function所具备的一些“配套设施”，它们包括：this、super、arguments对象和new.target。今天我们就来着重地讨论一下箭头函数。基本用法首先看一段代码：//

2018-01-15 16:45:24 480

原创浅谈Object.getOwnPropertyDescriptor

Object.getOwnPropertyDescriptor接口是对应于Object.getOwnPropertyDescriptors接口而存在的。所不同的是前者只能返回对象某个特定属性的描述信息。所以它有两个参数，第一个参数接收对象A，第二个参数接收对象A的属性B。然后会返回属性B的描述符（这个描述符是对象类型）。const object1 = { prop1 : 100;}con

2018-01-10 17:04:45 541

原创浅谈Object.getOwnPropertyDescriptors

在ES2017的版本中，Object对象新增了一个方法——Object.getOwnPropertyDescriptors。这个方法主要的作用是返回属性的描述对象（descriptor）。const obj = { prop1 : 100, prop2 : "字符串属性", get bar(){return "bar返回字符串"}}Object.getOwnPropertyD

2018-01-10 15:46:30 6870

原创 ES6中的super关键字

在JavaScript中，this关键字总是指向函数所在的当前对象，ES6中增加了一个与this对应的super关键字，指向的是当前对象（this指向的对象）的原型对象。const demo1 = { prop1 : '属性1'};const demo2 = { find(){ //返回demo2 的原型对象的foo属性 return su

2018-01-10 14:14:07 4833 1

原创对象方法的name属性

在ES6中的规范中，为函数对象添加了一个name属性，用来保存函数的名称。例如： function sayHello(){ console.log("Hello"); } sayHello.name //sayHello; 全局函数 sayHello的名称就是sayHello。对于匿名函数来说，如果将匿名函数赋值给了某个变量，那么那个变量的名字就会被保存在函数的name属

2018-01-10 13:50:15 4753

原创浅谈Object.assign

Object.assign是ES6新添加的接口，主要的用途是用来合并多个JavaScript的对象。Object.assign()接口可以接收多个参数，第一个参数是目标对象，后面的都是源对象，assign方法将多个原对象的属性和方法都合并到了目标对象上面，如果在这个过程中出现同名的属性（方法），后合并的属性（方法）会覆盖之前的同名属性（方法）。assign的基本用法如下：var t

2018-01-09 22:51:23 90951 3

原创对象属性的遍历（二）

在之前的文章中，我们提到过三个遍历对象属性的原生API ——Object.keys()、Object.values()、Object.entries()。这三个API很常用，但是它们有自己的局限，在上文中提到过，首先它们三者都对“不可遍历”的属性“无可奈何”，其次对于“Symbol”属性，它们同样也无法遍历。所以在这里我们要系统的上述一下对象属性遍历的内容。刚刚我们提到过，对象的属性有时是

2018-01-09 20:28:16 470

原创判断对象相等的方法

在JavaScript中，如果我们想要判断两个对象之间是否相等，有下面的几种方法：采用相等运算符（==）采用严格相等运算符（===）采用ES6 中的 Object.is() 方法。先来说说第一种方法：采用相等运算符（==）会认为大致相等的两个对象（值）相等。具体来说就是像下面这样let a = 1;let b = "1"let result = (a == b)

2018-01-09 20:02:26 620

原创 ES6中用表达式作为对象属性名的语法糖

我们知道，访问对象的属性的时候有两种写法：var demo1 = {};// 写法一：demo1.prop1 = 1;// 写法二：demo1[prop2] = 2;那么这两种写法有什么不同呢？答案是在写法二中，我们可以在方括号中写入表达式，用表达式的值作为对象的属性。所以写法二还可以写成如下的形式：demo1['prop' + '2'] = 2; 在ES5的年代，在对象字面量

2018-01-09 19:46:43 1830

原创 ES6中对象简写属性名的语法糖

首先让我们看一段代码let demo1 = {};// 属性操作的get方法function get(key){ return demo1[key] ? demo1.key : null; }//属性操作的 set方法function set(key,value){ demo1.key = value;}//将对象还原成一个空对象的方法function clear(){

2018-01-09 18:49:21 6420

原创对象属性的遍历（一）遍历对象基础的三个API

我们在做JavaScript开发的时候，可能会遇到这样的情况，在我们自己的代码中，某个对象objC引用一个全局对象objB的某个属性propB。然后读取属性propB之后，再在我们自己的对象中，对propB的值做些加工。// 全局对象B ，包含属性bconst objB = { propB : 100;}//类A，class A(){ constructor(){

2018-01-09 14:58:38 1680

原创 ES6——对象的解构赋值

对象的解构赋值，用于从一个现有的对象取值，将其中所有可遍历但尚未赋值的属性，分配到指定的对象上面，所有的键和他们的值都会“浅拷贝”到新对象上面。//解构赋值let {x,y,...z} = {x:1,y:2,a:3,b:4,c:{ca : 5}}//结果如下：x //1y //2z //{a:3,d:4,c:{ca:5}}在上面的代码中，等号右边的对象的属性x，y，a，b，c都是可遍

2018-01-09 12:04:33 823

原创提案——Null传导运算符

在实际开发的过程中，我们想要读取某个对象的某个属性A时，往往需要在代码中先确定这个对象中含有在我们要读取的属性A。例如，有下面的对象Person代表一个人：//对象Person代表某个人var personA = { name : { firstName : "世民", lastName : "李" }, age : 52, sex

2018-01-09 11:20:43 844 1

qs8lk88的博客