一、构造函数及实例化原理
function Car(){
var a=1;//实例对象中没有a,因为a没有随this一块被返回
this.color='red';
//window.color='red'
}
Car()
console.log(color)//red window.color
函数运行了就有this指向,不运行没有this指向,没有实例化,只运行函数this指向window
构造函数也是函数
function Car(){
this.color='red';
}
var car1=new Car();
console.log(car1.color)//red
this指向car1,指向实例化对象
谁.就是指向谁
this指向对象,window对象、car1对象等,不指向函数本身
/**
* GO = {
* Car: function () {...}
* car1: {
* color: 'red',
* brand: 'Benz'
* }
* }
* AO = {
* this: {
color: color,
brand: brand
}
* }
*/
function Car(color, brand) {
/**
* this = {
* color: color,
* brand: brand,
AO
* }
*
* return this;
*/
this.color = color;
this.brand = brand;
}
var car1 = new Car('red', 'Benz');
console.log(car1.color);
第一步:new实例化,函数也运行,预编译AO出现,AO看见this,先
AO={this:{} }
第二步:看见this.color,this.brand,在this中填入color、brand及其值
第三步:隐式返回this,return this
这个this是对象
new语句是为了隐式返回一个this,return this
相当于:
function Car(color, brand) {
var me = {};
me.color = color;
me.brand = brand;
return me;
/**
* me = {
* color: color,
* brand: brand,
AO: 有AO,函数中有AO
* }
*/
}
var car = Car('red', 'Mazda');
console.log(car.color);
console.log(car.brand);
不需要new,也新建了对象
构造函数与普通函数没有任何区别,没有声明区别
相当于
function test(){
var obj={
name:'a',
color:'blue'
}
return obj;
}
var obj1=test();
console.log(obj1)
function test(name,color){
var obj={
name:name,
color:color
}
return obj;
}
var obj1=test('a','blue');
console.log(obj1)
返回一个对象就是构造函数
// 如果 return 的不是原始值,将会被返回,否则,隐式返回this
function Car() {
this.color = 'red';
this.brand = 'Benz';
return {};
}
var car1 = new Car();
console.log(car1);
return原始值,返回this
return引用值,返回引用值
二、包装类
原始值没有自己的属性和方法。
null、undefined不可以设置属性和方法。
1.Number
2.String
3.Boolean
系统内置构造函数new Number,new String…
var a = 1; // 原始值
var b = new Number(a);
b.length = 1;
b.add = function () {
console.log(1);
}
var d = b + 1;
console.log(b); // 2
var a = 'abc';
console.log(a);
var aa = new String('abc');
console.log(aa);
var bb = aa + 'bcd';
console.log(bb);
var a = 123;
a.len = 3;
/*
new Number(123).len = 3 delete
因为没有赋值变量保存这个值,所以就删除了
*/
console.log(a.len); // undefined
// str -> length
// console.log(new String(str).length)
var str = 'abc';
console.log(str.length);
// 截断数组
var arr = [1, 2, 3, 4, 5];
arr.length = 3;
console.log(arr);
原始值隐式转换成相应的对象,
三、面试题
/**
* GO = {
* name: undefined -> 'hello' -> 'hello10'
* type: undefined -> 'string'
* }
*/
var name = 'hello';
name += 10;
var type = typeof (name);
if (type.length === 6) {
// new String(type)
// type.text = 'string'
// delete
type.text = 'string';
}
console.log(type.text); // undefined
//----------------------------------------------------------------
function Test(a, b, c) {
var d = 1;
this.a = a;
this.b = b;
this.c = c;
this.f = function () {
d++;
console.log(d);
}
// return this; 形成闭包
}
var test1 = new Test();
var test2 = new Test();
test1.f();
test1.f();
test2.f();
//----------------------------------------------------------------
/**
* GO = {
* x: undefined -> 1
* y: undefined -> 0 -> 4
* z: 0 -> 4
* add: function () { return n = n + 1 } -> function () { return n = n + 3 }
* }
*/
var x = 1,
y = z = 0;
function add(n) {
return n = n + 1;
}
y = add(x);
function add(n) {
return n = n + 3;
}
z = add(x);
console.log(x, y, z); // 1, 4, 4
//---------------------------------------------------------------------
function foo1(x) {
console.log(arguments);
return x;
}
foo(1, 2, 3, 4, 5); // 1,2,3,4,5
function foo2(x) {
console.log(arguments);
return x;
} (1, 2, 3, 4, 5); // 不会执行 (1, 2, 3, 4, 5)是表达式
(function foo3(x) {
console.log(arguments);
return x;
})(1, 2, 3, 4, 5); // 1,2,3,4,5
//---------------------------------------------------------------------
// 映射关系
function b(x, y, a) {
// a = 10;
// console.log(arguments[2]);
arguments[2] = 10;
console.log(a); // 10
}
b(1, 2, 3);
四、作业
写一个函数,接收任意一个字符串,返回这个字符串的总字节数
function getBytes(str) {
var str = String(str);
var bytes = 0;
var length = str.length;
for (var i = 0; i < length; i++) {
if (str.charCodeAt(i) > 255) {
bytes += 2;
} else {
bytes += 1;
}
}
return bytes;
}
console.log(getBytes('你好哈哈'));