ES6: 符号类型
引入原因： 实现私有属性 let s = Symbol() let obj = {[s]: ‘hello world’}; console.log(obj.s); //undefined 符号值唯一 let s = Symbol() let m = Symbol() console.log(s === m) 创建： 不能用字面量形式创建 使用Symbol(desc)函数创建，不需要添加new Symbol.for(key)在全局符号注册表中查找key符号值，如果找到就返回，没找到就创建一个新的符号值 Symbol.keyFor(symbol): 返回符号值的key 枚举： 符号类型的key是不能被枚举的，Object.keys()以及Object.getOwnPropertyNames()都不能返回符号类型的key Object.getOwnPropertySymbols()则会返回对象中所有符号类型的key 共享符号值： Symbol.for(desc): 在全局符号注册表中查找描述为desc的符号，如果找到，返回这个符号值，如果 ...
ES6: 对象和数组解构
所谓解构，指的是将数据结构分解为更小的部分，从而使数据提取变得容易。 对象解构： 使用解构时，必须提供初始化值 let Person = { name: 'sen', age: 18 } let {name, age} = Person; 解构表达式的值为=右侧的值 如果对象中没有同名属性时，解构表达式新赋值的变量的值为undefined 解构对象只是赋值时，需要加() 赋值给不同名的变量 let Person = { name: 'sen', age: 18 } let {name: localName, age: localAge} = Person; 设置默认值 let Person = { name: 'sen', age: 18 } let {name, age: localAge = 18} = Person; 嵌套解构 let Person = { name: &# ...
ES6: 对象扩展
初始化简写： function createPerson(name, age) { return { name: name, age: age }; } ---> function createPerson(name, age) { return { name, age }; } 方法简写： var person = { name: "sen", sayName: function() { return this.name; } }---> var person = { name: "sen", sayName() { return this.name; } } 需要计算的属性名用[]表示 Object.is() 与===表现相同，除了 Object.is(NaN, NaN) // true Object.is(+0, -0) // false Obj ...
ES6: 函数扩展
带默认值参数的函数：var get_name = function(url, id=1, callback){}; 如果传入了第二个参数，将不会使用默认值 如果给第二个参数赋值为undefined，会使用默认值 带有默认值的参数后，arguments的内容将不会随着形参的改变而改变 排在后面的参数可以将前面的参数作为默认值，而前面的参数不能引用后面的参数作为默认值 剩余参数：var get_name = function(url, …keys) 除了第一个参数url外，剩余所有参数都会被放到keys数组中 函数只能有一个剩余参数，且必须放到最后 剩余参数不能在对象字面量的setter属性中使用 延展运算符：var args = ['url', 123, 'st']; get_names(...args); new.target: 使用new创建一个对象时，会被赋值为新对象的构造器 ES6允许在代码块中定义函数，在严格模式中，块级函数只能在块级作用域中使用，而非严格模式中，块级函数会被提升到全局 箭头函数 ...
ES6: 字符串处理
UTF-16编码： str.codePointAt(index) String.fromCodePoint(codepoint); normalize() 正则表达式 新增u修饰符用来处理UTF-16编码的问题 /&.$/u 新增pattern.flags 属性 // ‘ig’ 新增pattern.sticky 属性及’y’修饰符 // 只从lastIndex处匹配，如果和’g’一起存在则’g’被忽略 复制正则表达式 // let pattern = new RegEX(old_pattern, ‘gi’) 字符串处理 str.includes(sub_string) // true or false str.startsWith(sub_string) // true or false str.endsWith(sub_string) // true or false str.repeat(times); // str * times 模板字面量 支持多行字符串 支持变量 // `hello ${name ...
ES6: 块级作用域
var 没有块级作用域的概念 会被提升到定义函数的顶部 可以重复声明 let 有块级作用域 不会被提升 禁止重复声明 const 有块级作用域 不会被提升 禁止重复声明 其值不可更改 必须进行初始化
Javascript中的表单
var form = document.getElementById(‘myform’); form.acceptCharset 服务器能处理的字符集 form.action 接受请求的URL form.elements 表单中的所有控件 form.enctype 编码类型 form.length 控件数量 form.method HTTP请求类型 form.name // document.forms[form.name] form.reset() form.submit() form.target var text = form.elements[‘sex’]; text.disabled text.form text.name text.value text.readOnly text.tabIndex text.type text.select() text.setSelectionRange(start, end) text.value.substring(text.selectionS ...
Javascript中的事件
事件捕获(capturing)和事件冒泡(bubbling) 添加事件处理程序的两种方法 // onclick=null elem.addEventListener(“click”, e_func, false); //elem.removeEventListener(‘click’, e_func, false); //false 表明在冒泡阶段被触发 事件对象 e.bubbles // true or false 是否冒泡 e.cancelable // true of false 是否可取消默认行为 e.currentTarget // 正在处理事件的元素，事件处理程序中的this指向该元素 e.target // 事件发生的目标元素 e.defaultPrevented // true or false 默认行为是否被取消 e.detail e.eventPhase // 1 捕获阶段 2 处于目标 3冒泡阶段 e.preventDefault() e.stopImmediatePropagation() //阻止事件冒泡 ...
DOM中的选择符API及元素遍历
选择符API document.querySelector(css_selector) var checked_radio = document.querySelector(‘.checked’); var node_list = document.querySelector(css_selector); elem.matchesSelector(css_selector) // true or false HTML 5中的类名操作classList是DOMTokenList的实例，因而具有以下方法： elem.classList.add(value); 如果已经有了就不添加了 elem.classList.contain(value) //true or false elem.classList.remove(value) elem.classList.toggle(value); 如果有就删除，如果没有就添加 元素遍历Element新增5个属性： childElementCount: 子元素的个数（不包括Text和Comment类型） f ...
Javascript中的DOM节点类型
Node类型 node.nodeType: Node.ELEMENT_NODE(1); Node.ATTRIBUTE_NODE(2); Node.TEXT_NODE(3); Node.CDATA_SECTION_NODE(4); Node.ENTITY_PREFERENCE_NODE(5); Node.ENTITY_NODE(6); Node.PROCESSING_INSTRUCTION_NODE(7); Node.COMMENT_NODE(8); Node.DOCUMENT_NODE(9); Node.DOCUMENT_TYPE_NODE(10); Node.DOCUMENT_FRAGMENT_NODE(11); Node.NOTATION_NODE(12); node.nodeName: 标签名 node.childNodes[0] node.childNodes.item(0); node.childNodes.length; node.parentNode; node.nextSibling; nod ...