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 ...
Javascript中的history对象
history.go(): 参数为负数表示后退,正数表示前进; 接URL表示跳到历史记录最近的URL
history.back(): 后退一个页面
history.forward(): 前进一个页面
history.length: 历史记录的个数
Javascript中的navigator对象
navigator.appVersion
navigator.buildID // firefox
navigator.cookieEnabled
navigator.javaEnabled()
navigator.mimeTypes
navigator.language
navigator.onLine
navigator.oscpu
navigator.platform
navigator.plugins
navigator.userAgent