JS学习笔记1

变量名的前缀标记法:

数组   aValues  
布尔   bFound
浮点   fValues
函数   fnMethod
整型   iValues
对象   oType
正则   rePattern
字符串  sValues
变型    vValues

5种原始类型(primitive type):Undefined,Null,Boolean,Number,String

tip:
浮点数在计算之前,真正存储的是字符串;
STRING类型的独特之处在于,它是唯一没有固定大小的原始类型;

Number:
iNumber.toFixed(2);
iNumber.toPrecision(2);

String:
String.valueOf();
String.toString();
String.CharAt(1);
String.CharCodeAt(1);
String.concat();
String.indexOf();
String.lastIndexOf();
String.localeCompare();
String.slice();
String.substring();
String.toLowerCase();
String.toUpperCase();

instanceof 

本地对象:
1.Array
var aColors = new Array();
aColor[0] = "red";
aColor[1] = "blue";

var aColors = new Array("1","2","3");

var aColors = ["1","2","3"];
数组最多可以存放4294967295项,这应该可以满足大多数程序设计的需要.

array.join();
array.split();
array.push();
array.pop();
array.shift();
array.unshift();
array.reverse();
array.sort();
array.splice();

2.Date
var d = new Date();
d.getTime();
d.getMonth();
d.getDate();

3.global

encodeURI();
encodeURIComponent();

decodeURI();
decodeURIComponent();

4.Math
Math.max();
Math.min();
Math.abs();

Math.ceil();
Math.round();
Math.floor();

Math.log  .exp  .pow

Math.sqrt();

Math.random();

第四章  继承

1.对象冒充
 this.newMethod = ClassA;
 this.newMethod(sColor);
 delete this.newMethod;

2.CALL()方法
ClassA.call(this,sColor);

3.APPLY()方法

 

第5章  浏览器中的JAVASCRIPT
1.窗口操作
 moveBy();
 moveTo();
 resizeBy();
 resizeTo();
2.打开窗口
 window.open();

3.系统对话框
 alert();
 confirm();
 prompt();

4.状态栏
window.statue

5.时间间隔和暂停
  setTimeout();
  setInterval();

6.历史
 history.go();
 history.back();
 history.forward();

document对象

document.title
document.images[0];
document.write();
document.writeln();

location对象

navigator对象

screen对象
 availHeight;
 availWidth;
 colorDepth;
 height;
 width;

 

测试代码:

//3   利用参数个数模拟函数重载;
function DoAdd(){
  if(arguments.length==1){alert("1")}
  else if(arguments.length==2){alert("2")}
}

DoAdd(1);
DoAdd(1,2);

//5  数组的使用例子
var aValues = ["red","green","yellow"];
aValues.push("blue");
alert(aValues.toString());
aValues.pop();
alert(aValues.toString());
aValues.shift();
alert(aValues.toString());
aValues.unshift("unshift");
alert(aValues.toString());
aValues.reverse();
alert(aValues.toString());
aValues.sort();
alert(aValues.toString());

aValues.splice(2,0,"red");
alert(aValues.toString());
aValues.splice(0,2);
alert(aValues.toString());

 

//7  工厂方式

function createCar(sColor,iDoors,iMpg){
 var oTempCar = new Object;
 oTempCar.color = sColor;
 oTempCar.doors= iDoors;
 oTempCar.mpg= iMpg;
 oTempCar.showColor = function (){alert(this.color);}
 return oTempCar;
}

var oCar1 = createCar("red",4,23);
var oCar2 = createCar("blue",3,25);

oCar1.showColor();
oCar2.showColor();

//8  函数外定义方法
function showColor(){alert(this.color);}

function createCar(sColor,iDoors,iMpg){
 var oTempCar = new Object;
 oTempCar.color = sColor;
 oTempCar.doors= iDoors;
 oTempCar.mpg= iMpg;
 oTempCar.showColor = showColor;
 return oTempCar;
}

var oCar1 = createCar("red",4,23);
var oCar2 = createCar("blue",3,25);

oCar1.showColor();
oCar2.showColor();

//9  构造函数方式
function Car(sColor,iDoors){
  this.color = sColor;
  this.doors = iDoors;
  this.showColor = function(){alert(this.color)};
}

var oCar1 = new Car("red",4,23);
var oCar2 = new Car("blue",4,23);
oCar1.showColor();
oCar2.showColor();

//10  混合的构造函数/原型方式
function Car(sColor,iDoors){
  this.color = sColor;
  this.doors = iDoors;
  this.drivers = new Array("Mike","Sue");
}

Car.prototype.showColor = function (){alert(this.color);}

var oCar1 = new Car("red",4,23);
var oCar2 = new Car("blue",4,23);
oCar2.drivers.push("Matt");

oCar1.showColor();
alert(oCar1.drivers);

//11  继承--对象冒充
function ClassA(sColor){
 this.color = sColor;
 this.sayColor = function (){alert(this.color);};
}

function ClassB(sColor,sName){
 this.newMethod = ClassA;
 this.newMethod(sColor);
 delete this.newMethod;

 this.name = sName;
 this.sayName = function(){alert(this.name)};
}

var objA = new ClassA("red");
var objB = new ClassB("blue","Nick");

objA.sayColor();
objB.sayColor();
objB.sayName();

//12  CALL()方法
function sayColor(sPrefix,sSuffix){
 alert(sPrefix+this.color+sSuffix);
}

var obj = new Object();
obj.color = "red";
sayColor.call(obj,"the color is "," , a very nice color indeed. ");

 

function ClassA(sColor){
 this.color = sColor;
 this.sayColor = function (){alert(this.color);};
}

function ClassB(sColor,sName){
 //this.newMethod = ClassA;
 //this.newMethod(sColor);
 //delete this.newMethod;
 ClassA.call(this,sColor);

 this.name = sName;
 this.sayName = function(){alert(this.name)};
}

var objA = new ClassA("red");
var objB = new ClassB("blue","Nick");

objA.sayColor();
objB.sayColor();
objB.sayName();

//13  一个继承的例子
function Polygon(iSides){
 this.sides =  iSides;
}

Polygon.prototype.getArea = function (){return 0};

function Triangle(iBase,iHeight){
  Polygon.call(this,3);
  this.base = iBase;
  this.height = iHeight;
}

Triangle.prototype = new Polygon();
Triangle.prototype.getArea = function (){
  return 0.5 * this.base * this.height;
};

var triangle = new Triangle(12,4);

alert(triangle.sides);
alert(triangle.getArea());

function Rectangle(iLength,iWidth){
 Polygon.call(this,4);
 this.length = iLength;
 this.width = iWidth;
}
Rectangle.prototype.getArea = function(){
  return this.length * this.width;
}

var rectangle = new Rectangle(3,4);
alert(rectangle.sides);
alert(rectangle.getArea());

//14 文档碎片
 function show(){
 var arrText = ["first","second","third","fourth","fifth","sixth"];
 var oFragment = document.createDocumentFragment();

 for(var i=0;i<arrText.length;i++){
   var oP= document.createElement("p");
   var oText = document.createTextNode(arrText[i]);
   oP.appendChild(oText);
   oFragment.appendChild(oP);
 }
 
 document.body.appendChild(oFragment);
}

//15 DOM创建表格
var oTable = document.createElement("table");
oTable.setAttribute("border","1");
oTable.setAttribute("width","100%");

var oTbody = document.createElement("tbody");
oTable.appendChild(oTbody);

oTbody.insertRow(0);
oTbody.rows[0].insertCell(0);
//oTbody.rows[0].cells[0].appendChild(document.creatTextNode("cell 1"));

oTbody.insertRow(1);
oTbody.rows[1].insertCell(0);
document.body.appendChild(oTable);