Skip to content

Instantly share code, notes, and snippets.

@myvyang
Last active August 29, 2015 14:10
Show Gist options
  • Save myvyang/a038c279728c026cebca to your computer and use it in GitHub Desktop.
Save myvyang/a038c279728c026cebca to your computer and use it in GitHub Desktop.
// Javascript 函数与对象 起源
// 先来看看几个东西
// typeof 作用符: 查看类型
typeof 1
typeof x
typeof {a:"1"}
typeof undefined
typeof "aaaa"
typeof null
typeof [1, 2, 4]
typeof Number
typeof Object
typeof new Number()
typeof new Function()
/*
Undefined "undefined"
Null "object"
Boolean "boolean"
Number "number"
String "string"
Function object "function"
Any other object "object"
Symbol (new in ECMAScript 6) "symbol"
Host object (provided by the JS environment) Implementation-dependent
*/
typeof null //object
typeof [1, 2, 4] //object
typeof Number //function
typeof Object //function
typeof new Number() //object
typeof new Function() //function
//javaScript中只有object是对象数据类型。
//new XXX()都是返回对象(除了 Function), 其本身是函数类型
//Javasctipt 只有 null, undefined, 直接字面量, 函数, 对象。
//下面来看看 对象的定义方式
var obj = {
a: 1,
b: "2"
}; //直接声明对象
//对象本身就是一个 key-value 集合
var objF1 = function(xx) {
x = {};
x.a = xx;
x.b = 2;
return x;
}
var obj = objF1("aa");
// 函数返回,约等于直接构造
var objF2 = function(x) {
this.a = x;
this.b = "2";
}
var obj = new objF2("xx");
// new 方式构造对象
//更复杂一点的对象构造
var objF = function(x, y) {
this.a = 1;
this.b = "2";
this.px = x;
this.py = y;
this.getA = function() {
return this.a;
}
this.toString = function() {
return "->string["+x+"]";
}
}
objF.xxx = 1;
var obj1 = new objF("k", 1); // {a: 1, b: "2", px: "k", py: 1, getA: function…}
var obj2 = new objF("z", 2); // objF {a: 1, b: "2", px: "k", py: 2, getA: function…}
obj1 + 1 // "->string[k]1"
// 为什么要有 new 的构造方式? 和函数内构造完成之间返回有什么区别?
//先理解 this
// this 代表函数的调用者
var x = {
a: "x",
f: function(){return this.a}
}
x.f() // "x"
var y = {
ff: x.f,
a: "y"
}
y.ff() // y
obj1.xxx // undefined
// 函数本身的属性在实力化的时候并不会被绑定到对象上
// 但是 this 的属性被绑定到了生成对象上
// 理解一个东西: 原型 prototype
// 构造过程: 函数定义时生成一个对应的原型,可通过 F.prototype 访问。
// 当使用 new 运算符构造对象时, 函数内的 this 指针指向原型,最终返回对原型拷贝操作的结果(原型本身不会被改变)
objF.prototype.h = 1;
obj1.h // 1
objF.hh = 1;
obj1.hh // undefined
// new 作用符的特殊性
// 当函数被 new 调用的时候,this 会绑定到 function 的 prototype(原型) 上,而不是绑定到函数对象本身,其他时候绑定到函数对象本身
objF.prototype.constructor === objF // true 原型由函数本身构造
var arr = [];
for (var i = 0; i < 5; i++) {
arr[i] = i;
}
arr.push(99);
for (var index in arr) {
alert(index); // 0 1 2 3 4 5
}
// 数组本身只是一个对象,但是只允许整数作为 key
typeof null //object
typeof [1, 2, 4] //object
typeof Number //function
typeof Object //function
typeof new Number() //object
typeof new Function() //function
// 只有 function 才能有 prototype, 因此 Object 等这些类型构造器本身都是函数,用来构造类型
objF.constructor // Function
Function.constructor // Function
obj1.constructor // objF
objF.constructor.prototype // Empty
objF.constructor === Function // true
Function.prototype // Empty
// 对象都是函数构造出来的(constructor), 函数都是 Function 构造出来的(包括 Function 自身)
// Function 的原型为空
// 构造过程: 函数定义时生成一个对应的原型,可通过 F.prototype 访问。
// 当使用 new 运算符构造对象时, 函数内的 this 指针指向原型,最终返回对原型拷贝操作的结果(原型本身不会被改变)
// 该拷贝为浅拷贝(但是函数内如果通过 this.x = {xxx...} 的方式定位,则是生成对象,是相互独立的)
var f = function(){
this.x = {a: "1"};
}
f.prototype.y = {a:"2"};
obj1 = new f();
obj2 = new f();
obj1.x.a = 3;
obj1.y.a = 3;
obj2.x // "1"
obj2.y // 3
var sum = new Function("a","b","return a+b"); // 万物祖先
alert(sum(10,20));//30
//继承
function Bird() {
this.species = "Bird";
}
function Dork(name, color) {
this.name = name;
this.color = color;
}
Dork.prototype = new Bird(); //不完美
Dork.prototype.constructor = Dork;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment