精通JavaScipt第二版笔记——特性、函数和对象
前言：感觉这本书只有第二章 第三章有点看头
基本类型和引用类型
- 基本类型：字符串 数字 布尔值 null(待确定) undifined
- 引用类型：对象 数组
引用传递 保存的只是对象的地址
var obj = {};
var obj1 = obj;
obj.name="hey";
obj.name === obj1.name
自修改对象
var items = [1,2,3];
var items1 = items;
items.push(4);
items.length === items1.length
更改对象的引用
//将items设置为字符串数组（对象）
var items = ["one","two","three"];
var items1 = items;
items = ["new","array"];
//现在items items1指向不同的对象
//items指向 new array
//items1指向 one two three
修改对象生成一个全新对象而非自修改对象
var item="test";
var itemstr = item;
items+='ing';
console.log(item!=itemstr)
作用域
var foo = 'test';
if (true) {
var foo = 'new test';
}
console.log(foo === 'new test');
function test() {
var foo = 'old test';
}
test();
console.log(foo === 'new test');
function test() {
foo = 'test';
}
test();
console.log(window.foo === 'test');
上下文
function setFoo(fooInput) {
this.foo = fooInput
}
var foo = 5;
console.log('foo at the window level is set to'+foo);
var obj = {
foo:10
}
console.log('foo at the obj is set to'+obj.foo)
setFoo(15);
console.log('now foo at the window level is set to'+foo);
obj.setFoo = setFoo;
obj.setFoo(20);
console.log('foo at the obj is now set to'+foo)
更改函数上下文
function changeColor(color) {
this.style.color = color;
}
changeColor("white");
window对象没有style对象
var main = document.createElement('div');
changeColor.call(main,"black");
console.log(main.style.color)
function setBodyColor() {
changeColor.apply(document.body,arguments);
}
setBodyColor('black');
闭包
var obj = document.getElementById("main");
obj.style.border = '1px solid red';
setTimeout(function() {
obj.style.display="none"
},1000)
function delayedAlert(msg,time) {
setTimeout(function({
console.log(msg)
),time)
}
柯里化
function addGenerator(num) {
return function(toAdd) {
num+toAdd
}
}
var addFive = addGenerato(5);
console.log(addFive(4)==9)
ID为main的元素
var obj = document.getElementById("main");
要绑定的数组
var items = ['click','keypress'];
迭代数组中的每一项
for (var i =0;i<items.length;i++) {
利用自执行的匿名函数生成作用域
(function() {
记住这一作用域中的值
在该作用域中每个items的值都是唯一的，不依赖父上下文中所创建的变量
var item = items[i];
为元素绑定时间
obj['on'+item] = function() {
item指向处于for循环上下文的父变量
console.log('thanks for your' +item)
}
}) ()
}
函数重载
function sendMessage(msg,obj) {
if(arguments.length=2) {
obj.log(msg)
}else{
console.log(msg)
}
}
修改对象
如今javascript有三种方式控制某个对象能否修改，我们将按照严格程度从最低到最高一次讲解
- Object.preventExtensions()
阻止新的属性添加到对象中，当前的属性可以照用不误
创建一个新对象
var obj = {};
使用preventExtensions创建一个新对象
var obj2 = Object.preventExtensions(obj)
报错
Object.defineProperty(obj2,'greeting',{value:'hello'})
- Object.seal()
使用Object.seal()能够限制对象的能力，这类似Object.preventExtensions
不过和之前的例子不同的是属性不能删除，也不能转换成存取器(accessor,getter方法)
删除或添加属性同样会报错，已有的可写属性是例外
var obj={};
obj.greeting = 'welcome';
Object,seal(obj);
更新已有的可写属性
无法将已有属性转换为存储器
obj.greeting = 'hello'
Object.defineProperty(obj,'greeting',{get:function() {
return 'hello world'
})
无法删除属性
delete.obj.greeting;
- Object.freeze()
三种方法中最为严格的方法，一旦使用对象就被默认为不可改变的了。无法再添加删除更新属性。如果本身是一个对象的话，那该对象可以更新称为浅冻结。想生成一个不可改变的对象，所有值是对象的属性必须要冻结
var obj = {
greeting:'welcome';
innerObj:{}
}
Object.freeze(obj)
报错
obj.greeting = 'hello';
innerObj可更新
obj.innerObj.greeting="hello"
无法将已有属性转换为存取器
Object.defineProperty(obj,'greeting',{get:function(} {
return 'hello world'
})
试图删除属性
delete.obj.greeting
冻结内部对象
Object.freeze(obj.innerObj)
报错
obj.innerObj.greeting = 'dfsfsf';
