javascript 基础总结

javascript 基础总结

自己第一次在csdn上写文章，留个纪念。

简介

• Javascript 最流行的语言，轻量级，可由现代浏览器执行。
• 是现代浏览器及 html5默认的语言 。
• 浏览器逐行读取，不像传统编程会对所有代码进行编译。

实现

javascript脚本放在‘script， /script之间。通常script，/script标签放在head，/head标签中，或者页面body，/body底部。也可以引入外部的javascript脚本。

注意现在script标签已经不需要写成script type=“text/javascript”

写javascript语句时可以用“；”来进行分隔，也可以省略。

javascript 语句的注释可以用// 或者/* */

js 变量

变量是存储信息的容器，可以把变量看做存储数据的容器

• javascript变量的声明（创建）

  var car;
  

• javascript 的赋值

  car="Volvo";
  

• 两者可以写一起

• js变量必须以字母开头（虽然$和_也可以，但不推荐）

• js变量对大小写敏感

• undefined 即"缺少值"，而null表示"缺少对象"

• javascript拥有动态类型，相同变量可以做不同的类型

  var a; a=1; a='aaa'；
  

js数据类型及对象

js的数据类型为 字符串、数字、布尔、数组、对象、null、undefined

js中所有的事务都是对象，对象拥有属性和方法,（字符串，数字，布尔，数组其实算内置对象）

• 定义一个数组

  var cars=new Array();//第一种方法
  car[0]='bmw';
  
  var cars=new Array("bmw");//第二种方法
  
  var cars=['bwm'];//第三种方法
  

• 定义一个对象

  //第一种方法
  var person={
      firstname:"bill",
      lastname:"Gates",
      id:0001
  };
  //第二种方法
  var person=new Object();
  person.firstname='bill';
  ...
  

js函数

函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块

• js函数语法：(可以发送任意多的参数由’,'分隔)

  function functionname()
  {
  ...
  }
  

js运算符

• 算术运算符：+, -, *, /, %, ++, --,

• 赋值运算符：=, +=, -=, *=, /=, %=,

• 比较运算符：==, ===, !=, >, <, >=, <=,

• 逻辑运算符：&&, ||, !,

js条件语句

条件语句一般可以用if或者swith语句来写

if()//条件
{//代码块
}

if()
{
}
else
{
}

if()
{
}
else if()
{
}
else
{
}

switch(n)
{
case 0://表达式n（通常是一个变量)，与每个case的值做比较
  ...
  break;
default://default关键词来匹配不存在的事情
   ...

}
   

break为跳出循环

continue为进入下一个迭代

js循环

循环一般可以用for语句或者while语句来写,还可以用来遍历对象属性

//for 循环
for(var i=0;i<5;i++)//语句二是运行代码块的条件
{
//代码块
}

//语句一和语句三有时可以省略
var i=2;
for(;i<5;i++)
{
    //代码块
}

//while 语句
while()//条件为true循环执行代码块
  {
      
  }  

//do while语句,循环至少执行一次
do
  {
      
  }
while();
      
      
      

var car,vip;
vip=(car=='Volvo')?"svip":"vip";//如果car是沃尔沃，则是沃尔沃的svip，不然就只是vip

for (x in person)//person为一个对象，遍历对象属性
{
txt+=person[x];
}

jS错误

• try 语句允许我们进行定义代码块，此代码块在测试时可以有错误。

• catch语句在try代码块发生错误时执行（可省略）

• finally语句在try和finally之后，无论有无异常都会执行（可省略）

• throw抛出异常

  try{
  if() throw "";
  if() throw "";
  if() throw "";
  }
  catch(err){
  //err为""
  }
  finally{
  //一定会执行的
  }
  

Javascript在数据发送到服务器之前对表单进行验证。其中会用到with（对象）{}遍历对象中的每一个值，代码块内部首先每个局部变量若与对象某个属性同名，变量就会指向对象属性

js DOM 文档对象模型

网页被加载时会创建页面的文档对象

通过该对象可以访问html文档所有元素及属性，还可以改变CSS的样式，对页面中的所有事件作出反应,还可以操作节点。

• 访问html元素及属性

  element=document.getElementById("");//document.getElmentByTagName("");//访问元素
  
  element.innerHTml="..."//访问属性
  

• 改变元素css样式

  element.style.color="blue";
  

• 对事件作出反应

  按钮点击时触发：οnclick=“funcion()”；此外，onload用户进入页面时产生；onunload用户离开时产生；onchange,onfocus结合输入字段来用；

  onmouseon/down/over/out

• 操作节点

  var para=document.createElement("p");//创造p元素节点
  var node=document.createTextNode("...");//创造文本节点
  para.appendChild(node);向p里添加节点
  
  

js BOM浏览器对象模型

浏览器对象使javascript可以与浏览器进行“对话”。

• 操作浏览器进行窗口设置window.open()/close()/moveTo()/resizeTo()

• 操作浏览器进行屏幕信息screen.availWidth/availHeight

• 操作浏览器获取当前页面地址，进行重定向location.hostname/pathname/port/protocol/href/assign()

• 操作浏览器访问浏览器历史history.back()/forward()

• 操作浏览器访问浏览器信息navigator.appCodeName/appName/appVersion/cookieEnabled/platform

• 操作浏览器让浏览器进行计时

  setTimeout()该函数有两个参数：第一个参数是含有javascript语句的字符串；第二个参数是时间（单位毫秒），表是多少秒后执行该函数

  clearTimeout()用来取消setTimeout()

  var t;
  function timeMsg()
  {
       document.getElementById('txt').value=c;
       c=c+1;
       t=setTimeout("timeMsg()",1000);
  
  
  function stop()
  {
      clearTimeout(t);
  }
  

• 操作浏览器弹出消息框

  警告框

  alert("…"),出现警告框后用户需要点击确认才能继续

  确认框

  confirm("…")，出现确认框用户点击确认(返回true)或取消（返回false）按钮才能继续

  function show_confirm()
  
  {
  
  var r=confirm('"press a button")
  
  if(r==true){
  
  alert("you press ok!");
  
  }
  
  else{
  
  alert("you press cancel!");
  
  }
  
  }
  
  
  
  
  

  提示框

  prompt("…",“默认值”)，提示框出现需要用户输入某个值，然后和确认框相似

js cookie

某些网站为了辨别用户身份，储存在用户本地终端上的数据

我们将要创建的cookie的名字、值、日期等存入document.cookie对象中

document.cookie=c_name+"="+escape(value)+((expiredays==null)?"":";expires="+exdate.toGMTString()")

js 对象

javascript提供多个内建对象，比如String、Date、Array等，每个对象有相应的属性和方法

• 数字对象:方法属性很多可以参考w3school里列举的

  Javascript中所有的数均为64位，精度整数15位，小数17位，浮点运算不是100%准确

  Javascript是面向对象的，但不创建类，也不会通过类来创建对象

• 字符串对象：txt.length, indexOf(), match(), replace()

• 日期对象：date.setFullYear()等等

• 数组对象

• 逻辑对象(boolean 对象)

• 算术对象