1,对象:
PS:javascript数据类型1,原始类型(数字null、字符串string、布尔值boolean、null、underfined)2,对象类型(数组、函数)其中原始值是不可更改的。
创建对象:
---对象直接量:var point ={ x:1,
}y:2;
---通过new创建:var point = new Array{} //内置构造函数Object Array Date ReExp
var func1 = function(){...} var point = new func1(); //自定义构造函数,point是类func1的对象
---原型对象:每一个对象都从原型继承属性。通过Object.prototype获取对原型对象的引用
一个新对象可以继承一个旧对象的属性。
一旦有了一个想要的对象,可以利用Object.create方法构造出更多的实例来。
|
---Object.create():var obj = object.create(p) //创建obj对象,其原型指向p
var obj = object.create({x:1}); //obj继承了属性x
2,函数:定义一次,可被执行和调用多次。js中函数也是对象。函数返回值依赖return。
函数命名:like_this 或者 likeThis。 内部函数或私有函数通常以下划线为前缀_like
a,函数声明、表达式:
函数声明:function foo(){...} //声明前置
函数表达式:var foo = function(){...} //对象foo前置 但是foo=underfind
立即执行函数表达式:(function(){...}());
命名式函数表达式:var add = function foo(x){ return x*foo(x-1); }
函数表达式作为参数传给其他函数 data.sort( function(a,b){return a-b;} )
函数表达式在定以后立即调用: var add = (function(x){return x*x})
函数表达式适用于它作为一个大的表达式的一部分,特别适合只用到一次的函数,比如在赋值和调用过程中定义函数表达式。
上面两种形式实际上是相同的。function 语句在解释时会发生提升的情况,这会导致一个混乱。因为放宽了函数必须先声明后使用的要求。所以尽量不要使用function语句,请使用function表达式。
b,不同调用方式:
方法调用:o.method();
当一个函数被保存为对象的一个属性时,我们称它为一个方法。当一个方法被调用时,this 被绑定该对象。
|
|
当一个函数并非一个对象的属性时,那么它是被当做一个函数来调用的。
以此模式调用函数时,this 被绑定到全局对象。(语言设计上的一个错误,this 此时应该绑定到外部函数的 this 变量)
解决方案:在方法内定义一个变量并赋值为 this,那么内部函数可以通过访问该变量访问到 this,约定该变量命名为 that。
myObject.double = function () {var that = this;var helper = function () {that.value = add(that.value, that.value);};helper();}
一般函数调用,如果没有return,会返回underfind。如果是构造器,如果没有return或者return基本类型的话,会将this作为返回,否则返回对象。
构造器:new Foo();
一个函数如果创建的目的就是希望结合 new 前缀来调用,那它就被称为构造器函数,约定保存在大写格式命名的变量里;prototype 属性是可读写的,不是所有对象都有此属性,只有构造函数有此属性. 不是所有函数都是构造函数, 只有 new 出实例的函数才是构造函数.
call/apply/bind:func.call(o) 对象冒充
它让我们构建一个参数数组传递给调用函数,并允许我们选择 this 的值。apply 方法接受两个参数,第1个是要绑定给 this 的值,第2个是一个参数数组。
方法调用和函数调用最大区别就是调用上下文。方法调用的母体this就是调用它的对象。实际上会把母体作为实参传进去。但是函数调用this值是全局对象或者underfined(严格模式下)。
this保存:
var o = {
m:function(){
var self = this;
console.log( this === o); //true; this就是o
f();
function f(){
console.log(self === o); //true; this的值被保存在self,self一直是o
console.log(this === o); //false; this不是o,是全局变量或者underfined
}
1)var o={ //定义对象O
p:37; //设置O的属性
f:function(){ //设置O的方法
return this.p; //this就是对象O
}
}
o.f(); //函数作为对象方法调用时,this指向对象o。
2)对象原型链o上的this可以取到子链上的对象p
var o = {
f:function(){return this.a+this.b;}
}
var p = Object.create(o);//p的原型指向o;
p.a = 1;
p.b = 3;
p.f(); //4
3) 构造器上的this
function Myclass(){
this.a = 37; //没有return,所以返回this
}
myObject.prototype.sayHello = function(){
console.log('hello!');
}
var o = new Myclass(); //this指向空对象,空对象的原型指向Myclass.prototype属性
console.log(Myclass.a) //undefined Myclass中的this指的不是函数本身,而是调用a的对象,而且只能是对象。
console.log(o.a); //37 此时this是指实例化后的o
Myclass.sayHello() //typeError sayHello是原型方法 不是类方法,不可静态方式访问
o.sayHello() //hello
构造函数的私有公有属性:http://www.cnblogs.com/jikey/archive/2011/05/13/2045005.html
构造函数和原型的方式定义类的优缺点:http://blog.csdn.net/kkdelta/article/details/8456879
ES6:Always use class
. Avoid manipulating prototype
directly
// bad function Queue(contents = []) { this.queue = [...contents]; } Queue.prototype.pop = function () { const value = this.queue[0]; this.queue.splice(0, 1); return value; }; // good class Queue { constructor(contents = []) { this.queue = [...contents]; } pop() { const value = this.queue[0]; this.queue.splice(0, 1); return value; } }
比较:
function Myclass(){
this.a = 37; //有return对象,所以返回对象
return { a:38}
}
var o = new Myclass(); //this指向空对象,空对象的原型指向Myclass.prototype属性
o.a() //38
4)call/apply方法的this
function add(c,d){
return this.a + this.b + c +d;
}
var o = {a:1,b:3};
add.call(o,5,7) //1+3+5+7=16,o作为this对象替换add对象,参数扁平
add.apply(o,[10,20]); //1+3+10+20=34,参数数组
*神马时候使用call apply:
var value = "global var";
function mFunc()
{
this.value = "member var";
}
function gFunc()
{
alert(this.value);
}
window.gFunc(); // show gFunc, global var
gFunc.call(window); // show gFunc, global var
gFunc.call(new mFunc()); // show mFunc, member var
gFunc.call(document.getElementById('idTxt')); // show element, input text
eg2:
function bar(){
console.log(Object.prototype.toString.call(this)); //你想调用Object.prototype.toString但是想指定其中某个this时,Object.prototype.toString.call(this))来调用没有办法调用的方法
}
bar.call(7); //'[object Number]'输出7的类型->string
5)作用域:
<html>
<script>
var a=15;
function hehe(){
alert(a);
var a=5;
}
hehe();
</script>
</html>
输出Underfined,js所有声明会提前,
function hehe(){
var a=underfined;
alert(a);
a=5;
}
查找会从最内部开始查 里面已经有a了 只是undefined。
2,
var name = "The Window";
var object = {
name : "My Object",
getNameFunc : function(){
return this.name;
}
};
输出My Object,
var name = "The Window";
var object = {
name : "My Object",
getNameFunc : function(){
return function(){
return this.name;
};
}
};
输出The Window,
理解1:方法调用this指向调用上下文,函数调用this指向window
理解2:this在的函数,是谁的成员方法,那么这个this就是它,如果没有,默认this就是window对象。
理解3:
getNameFunc : function(){
function aaa(){
return this.name;
};
return aaa();
}
6)bind(ES5实现,ie9以上) 绑定一次重复调用,同apply call 更高效些。
3,原型链
Foo.prototype是Foo的预设对象属性,并不等于函数的原型。
创建函数的时候预设prototype属性,并且prototype有俩属性,constructor指向本身 _proto_并不是标准属性,是prototype的原型,指向object.prototype。所以tostring valueof才会被大部分对象使用。
Foo的prototype属性会作为new出来的对象(obj1,obj2,obj3)的原型(_proto_)
如果想让obj1,obj2,obj3同时具有某方法,可以在Foo.prototype属性创建实例共享方法。
例子:
create:声明一个空对象指向Person.prototype属性。随后给空对象定义方法
改变prototype
Student.prototype.x=101; //动态添加或者删除x
bosn.x; //101
Student.prototype={y:2} //直接修改prototype属性 赋值给新对象
bosn.y; //underfined 修改student.prototype值的时候不能修改已经实例化的对象。
bosn.x ;//101
var nunnly = new Student('nunnly',3,'class of keg');
nunnly.x //underfined
nunnly.y //2
图解:
4,属性查询可通过 . 和 [ ] 获取属性值
习惯用.查询,但是当需要动态获取属性名 或者 在未知属性名情况下用[ ]。
eg1:for(var i - 0; i <4; i++){ addr += custom['address' + i ] +'\n '}
eg2:function addStr(pro,stockname,shares){
pro[stockname] = shares; //stockname未知
}
5,作为命名空间的函数
在函数中声明的变量在整个函数内可见,
在函数外声明的变量在整个js应用程序中可见,特别容易发生冲突,
js无法声明一个代码块可见的变量。因此我们需要定义函数作为命名空间,从而避免污染全局命名空间。(或者用立即执行函数)