es5

ES5 defineProperty 和 ES6 proxy 实现数据劫持

南楼画角 提交于 2019-11-28 22:24:42
mvvm以数据驱动,其实使用了数据劫持的方式对数据双向更新 先来了解defineProperty对数据劫持 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> </head> <body> </body> <script> let myobj = {}; Object.defineProperty(myobj,"name",{ configurable:true,//configurable 给的说明是 如果为 false , 那么对象属性不可以修改, 不可以删除. true则相反 /*enumerable可枚举; 设置为true后可以用这4种方式去操作属性 1. for(let i in myobj){ console.log(i); } 2. Object.keys(); 3. JSON.stringify 4. Object.assign */ enumerable:true, get(){/

ES5

此生再无相见时 提交于 2019-11-28 17:35:53
一、ES5简介   ECMAScript 5.1 (或仅 ES5) 是ECMAScript(基于JavaScript的规范)标准的修正。 与HTML5规范进程本质类似,ES5通过对现有JavaScript方法添加语句和原生ECMAScript对象做合并实现标准化。 二、ES5严格模式   目的:     1.消除Javascript语法的一些不合理、不严谨之处,减少一些怪异行为。     2.消除代码运行的一些不安全之处,保证代码运行的安全。     3.提高编译器效率,增加运行速度。     4.为未来新版本的Javascript做好铺垫。   使用:     1.针对整个脚本文件:将"use strict"放在脚本文件的第一行,则整个脚本都将以"严格模式"运行。如果这行语句不在第一行,则无效,整个脚本以"正常模式"运行。如果不同模式的代码文件合并成一个文件,这一点需要特别注意。     2.针对单个函数:将"use strict"放在函数的第一行,则整个函数以"严格模式"运行。   语法及行为改变:     1.全局变量显式声明:在正常模式中,如果一个变量没有声明就赋值,默认是全局变量。严格模式禁止这种用法,全局变量必须显式声明。因此,严格模式下,变量都必须先用var命令声明,然后再使用。     2.函数形参不允许重复。     3.禁止使用with语句。     4

ES5基本数据类型解析

℡╲_俬逩灬. 提交于 2019-11-28 08:16:53
一、js简介 js组成部分(1995.2-1997.5(第一版ECMAscript)) 1、核心 ECMAscript 2、DOM 文档对象模型 Document Object Model 3、BOM 浏览器对象模型 Browser Object Model 二、html中使用js script元素的六个属性 1、async 可选 表示应该立即下载脚本,只对外部脚本文件有限 2、charset 可选 表示指定的代码的字符集(大部分浏览器忽略) 3、defer 可选 表示脚本可以延迟到文档完全被解析和显示之后被执行 4、language 已废弃 5、src 可选 表示包含要执行代码的外部文件 6、type 可选 可以看成是language的替代。 三、js基本概念 严格模式的概念 "use strict" (pragma(编译指示)) js中分号不准省略。 1、关键字(关键字错误=Idemtifier Expected) break、do、instanceof、typeof、case、else、new、var、catch、finally、return、void、continue for、switch、while、debugger、function、this、with、default、if、throw、delete、in、try 2、保留字 abstract、enum、int

【面试题】---前端需要掌握的知识点-----更新...

萝らか妹 提交于 2019-11-28 04:16:15
css 1、盒模型 2、flex 3、css单位 4、css选择器 5、bfc 清除浮动 6、层叠上下文 7、常见页面布局 8、响应式布局 9、css预处理,后处理 10、css3新特性 animation和transiton的相关属性 animate和translate 11、display哪些取值 12、相邻的两个inline-block节点为什么会出现间隔,该如何解决 13、meta viewport 移动端适配 14、CSS实现宽度自适应100%,宽高16:9的比例的矩形 15、rem布局的优缺点 16、画三角形 17、1像素边框问题 html 1、语义化 2、新标签新特性 3、input和textarea的区别 4、用一个div模拟textarea的实现 5、移动设备忽略将页面中的数字识别为电话号码的方法 JS 1、原型/原型链/构造函数/实例/继承 2、有几种方式可以实现继承 3、用原型实现继承有什么缺点,怎么解决 4、arguments 5、数据类型判断 6、作用域链、闭包、作用域 7、Ajax的原生写法 8、对象深拷贝、浅拷贝 9、图片懒加载、预加载 10、实现页面加载进度条 11、this关键字 12、函数式编程 13、手动实现parseInt 14、为什么会有同源策略 15、怎么判断两个对象是否相等 16、事件模型 事件委托、代理 如何让事件先冒泡后捕获 17

ES5新增数组方法测试和字符串常见API测试

烈酒焚心 提交于 2019-11-28 03:14:11
首先是ES5新增数组方法测试: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> </body> <script> // var arr = [1,2,6,3,4,5,6,7]; // var i = arr.indexOf(6,3); // console.log (i); // 用于返回某个数组或者字符串中规定字符或字符串的位置 // var arr = [1,2,6,3,4,5,6,7]; // arr.forEach(function(value,index,arr){ // console.log (value,index,arr); // }) //forEach循环,遍历数组,函数中的三个参数分别代表,该项的值,该项下标,数组本身 ,没有返回值,为undefined // map会遍历当前数组,然后调用参数中的方法,返回当前方法的返回值; // map不会改变原有数组,而是将函数执行一次之后的返回值组成一个新数组,返回出来 // var arr = [1,2,6,3,4,5,6,7]; // var newArr = arr.map(function(value,index,arr){ // return value

ES5的类

南楼画角 提交于 2019-11-27 22:35:28
1.最简单的类 function Person(){ this.name='张三'; this.age=20; } var p=new Person(); alert(p.name); 2.构造函数和原型链里面增加方法 function Person(){ this.name='张三';/*属性*/ this.age=20; this.run=function(){ alert(this.name+'在运动'); } } //原型链上面的属性会被多个实例共享 构造函数不会 Person.prototype.sex="男"; Person.prototype.work=function(){ alert(this.name+'在工作'); } var p=new Person(); //alert(p.name); //p.run(); p.work();    3.类里面的静态方法 function Person(){} Person.getInfo=function(){ alert('我是静态方法'); } //调用静态方法 Person.getInfo();    4.es5里面的继承 对象冒充实现继承 function Person(){ this.name='张三';/*属性*/ this.age=20; this.run=function(){/*实例方法*/

2019.08.17 Webpack4 bilibi

☆樱花仙子☆ 提交于 2019-11-27 15:26:39
将这些依赖打包吗? es6转es5,将sass,less,转成css。文件优化:压缩代码体积,合并文件。 代码分割:公共模块的处理,路由懒加载功能。模块合并:功能模块分类 自动刷新 来源: https://www.cnblogs.com/Py-king/p/11368326.html

数组的常用方法

浪尽此生 提交于 2019-11-27 15:19:43
22,js操作数组的方法 join():join(separator): 将数组的元素组起一个字符串,以separator为分隔符,省略的话则用默认用逗号为分隔符,该方法只接收一个参数:即分隔符。 push()和pop():push(): 可以接收任意数量的参数,把它们逐个添加到数组末尾,并返回修改后数组的长度。 pop():数组末尾移除最后一项,减少数组的 length 值,然后返回移除的项。 shift() 和 unshift():shift():删除原数组第一项,并返回删除元素的值;如果数组为空则返回undefined 。 unshift:将参数添加到原数组开头,并返回数组的长度 sort():按升序排列数组项——即最小的值位于最前面,最大的值排在最后面 reverse():反转数组项的顺序。 concat():将参数添加到原数组中。这个方法会先创建当前数组一个副本,然后将接收到的参数添加到这个副本的末尾,最后返回新构建的数组。在没有给 concat()方法传递参数的情况下,它只是复制当前数组并返回副本。 slice():返回从原数组中指定开始下标到结束下标之间的项组成的新数组。slice()方法可以接受一或两个参数,即要返回项的起始和结束位置。在只有一个参数的情况下, slice()方法返回从该参数指定位置开始到当前数组末尾的所有项。如果有两个参数

【ES6新增语法详述】

爷,独闯天下 提交于 2019-11-27 15:15:53
目录 1. 变量的定义 let const 2. 模版字符串 3. 数据解构 4. 函数扩展 设置默认值 箭头函数 5. 类的定义 class 6. 对象的单体模式 原文: http://blog.gqylpy.com/gqy/275 "@ ES6新增了关于变量的定义,函数扩展,数据结构,类,模块等概念,本文将详细介绍常用的ES6语法。 *** 1. 变量的定义 let ES6中新增了let语法,用来声明变量,用法类似var。 ==let定义的变量只在当前代码块内有效.== 如下示例: <script> if (true) { var username = 'zyk'; let age = 60; } console.log(username); // zyk console.log(age); // 错误 </script> ES5中只有全局作用域和函数作用域,没有块级作用域,所以下面代码中的var变量定义会被提升到函数作用域顶部: <script> var username = 'zyk'; function foo() { console.log(username); // 打印结果为:undefined if (true) { var username= "无名"; // var定义的变量会被提升至作用域的顶部 } } foo() </script> 而=

【ES6新增语法详述】

老子叫甜甜 提交于 2019-11-27 15:12:35
目录 1. 变量的定义 let const 2. 模版字符串 3. 数据解构 4. 函数扩展 设置默认值 箭头函数 5. 类的定义 class 6. 对象的单体模式 原文: http://blog.gqylpy.com/gqy/275 "@ ES6新增了关于变量的定义,函数扩展,数据结构,类,模块等概念,本文将详细介绍常用的ES6语法。 *** 1. 变量的定义 let ES6中新增了let语法,用来声明变量,用法类似var。 ==let定义的变量只在当前代码块内有效.== 如下示例: <script> if (true) { var username = 'zyk'; let age = 60; } console.log(username); // zyk console.log(age); // 错误 </script> ES5中只有全局作用域和函数作用域,没有块级作用域,所以下面代码中的var变量定义会被提升到函数作用域顶部: <script> var username = 'zyk'; function foo() { console.log(username); // 打印结果为:undefined if (true) { var username= "无名"; // var定义的变量会被提升至作用域的顶部 } } foo() </script> 而=