21、javascript 基础

Javascript

Javascript 是一种嵌入到HTML文档的脚本语言，由浏览器解释和执行，无需编译。

Javascript 是大小写敏感的，大写字母与小写字母不同。

使用“；”分号来分割每一句js。

<scirpt>标签

javascript 代码必须放在<script></script>标记中

引入外部脚本

<script src="text/javascript" src="/js.js"></script>

Javascript 输出

document.write("向html输出一句话");

document.getElementById('id').innerHTML="设置的值"; //找到html中ID属性为id的元素并设置他的文本。

Javascript 注释

//单行注释

/**/ 多行注释

Javascript 变量

在javascript中，使用var声明变量。如：var a,b,c;

使用 = 号 赋值。 如：a = 1; b = 2 ; c = "abc";

未赋值的变量值为underfined

Javascript 数据类型

基本类型：数字类型、布尔类型、字符串类型

引用类型：对象类型、函数类型

空类型：null、underfined

运算符：typeof

　　语法：返回类型是字符串，用于查看该变量属于什么类型。 string typeof(变量);

Javascript是若类型语言(不严格检查类型内容)，使用var声明变量。

<script type="text/javascript">
//基本类型
var num = 1; //number
alert(typeof (num));

var flag = true; //boolean
alert(typeof (flag));

var code = "123"; //string
alert(typeof (code));

//引用类型
var nums = new Array( 1,2,3,4,5); //数组 object
alert(typeof (nums));

var date = new Date(); //日期 object
alert(typeof (date));

var func = function(){}; //函数 function
alert(typeof (func));

//空类型
var color = null; //空 返回object 引用类型属于object 特例
alert(typeof (color));

var underfined; //underinfed 未定义
alert(typeof (underfined));
</script>

Javascript 数组

var arry1 = new Array();  //方式1
 arry1[0] = "bai";
 arry1[1] = "da";
 arry1[2] = "wei";
var arry2 = new Array("bai","da","wei"); //方式2
var arry3 = ["bai","da","wei"];  //方式3

alert(arry1.length);
alert(arry2.length);
alert(arry3.length);

Javascript 运算符

算数运算符：+（加）、-（减）、*（乘）、/（除）、%（取余）、++（递加）、--（递减）（字符串中+用于连接）。

赋值运算符：=（复制）、+=（加等于）、-=（减等于）、*=（乘等于）、/=（除等于）、%=（余等于）。

比较运算符：==（等于）、===（绝对等于）、！=（不等于）、>（大于）、<（小于）、>=（大于等于）、<=（小于等于）。

逻辑运算符：&&（与）、||（或）、！（非）。

Javascript 逻辑控制

IF--ELSE

用来区间性判断，类似c#。

var num = 10;
if(num > 0 && num < 5)
{
    alert(typeof (num));
}else if(num > 5 && num < 10)
{
    alert("else if");
}else
{
    alert("else");
}

Switch--Case

用于等值比较，类似c#。

var num = 10;
switch(num)
{
    case 1 :
        alert("1");
    break;
    case 2 :
        alert("2");
    break;
    default:
        alert("3");
    break;
}

三元运算符

conditions ? statementA : statementB ;

Javascript 循环

while循环

先执行再判断

var num = 1;
while(num<=10){
    document.write(num);
    num++;
}

do--while循环

先判断再执行

var num = 1;
do{
    document.write(num);
    num++;
}while(num<=10)

for循环

for(var num = 1; num <= 10; num++)
{
    document.write(num);
}

for--in循环

类似foreach，但是不同。

//遍历数组
var nums = new Array(1,2,3,4,89,23); //数组
for(var item in nums)
{
    document.write(item);
}

//遍历键值对 json
var kv = {
    "key1":"value1",
    "key2":"value2"
}
for(var item in kv)
{
    document.write(kv[item]);//输出的是值 item是键
}

Break和Continue

break 立刻退出循环

Continue 结束本次继续下次循环

函数

javascript中使用Function定义函数。

语法：

　　function　　函数名（参数列表）{

　　　　//如果有返回值直接return

　　}

function getMax(num1,num2)
{
    return num1 > num2 ? num1 : num2; //三元表达式
}

var num1 = 10;
var num2 = 20;
var result = getMax(num1,num2);
document.write(result);

Lambada函数（匿名函数）

var arry = [23,4,48,23,54,34,23,54]; 

var getMax = function (nums)   //注意这里不一样
{
    var result = 0;
    for(var i = 0;i < nums.length ; i++)
    {
        if(nums[i] > result)
            result = nums[i];
    }
    return result;
}

document.write(getMax(arry));

arguments 参数

在函数内部有一个arguments参数，用来表示函数的参数。

//如果一个方法不写参数，默认会有一个arguments
var func = function() //这里没有写参数
{
    document.write(arguments.length); //这里输出内置参数长度
}

func(1,2,3); //给这个方法三个参数 输出结果为3

可以看到即使不指定参数，默认也会有一个内置函数来接收他们。可以循环输出他们，如果在这个情况下写参数呢？

var func = function(num) //这里加一个参数
{
    document.write(num); //输出这个参数
    document.write(arguments[0]); //输出第一个内置函数的参数
    document.write(arguments.length); //这里输出内置参数长度
}

func(1,2,3);  //结果 1 ， 1 ， 3 

可以看出，arguments对象中第一个参数跟写上的参数是相等的。

因为javascript是没有方法的重载的，利用argments可以实现方法重载。

//可以这样模拟方法重载
//根据参数的个数不同来调用不同的方法
var foo = function()
{
    switch(arguments.length)
    {
        case 0 : 
            func1();
        break;
        
        case 1 : 
            func2();
        break;
        
        case 2 : 
            func3();
        break;
    }
}

Function对象

动态函数，将字符串变成函数。

最后一个参数是函数的方法体，之前的参数都是函数的参数。

var func = new Function("num1","alert(num1)"); //将指定字符串转换为javascript函数
func(10);

//等同于

var func = new Function("num1","alert(num1)")(10); //直接执行

Javascript 对象

js是面向对象的语言。

js中对象就是键值对，因为在键值对中，值可以是数字、字符串或布尔类型。比如字段。也可以是函数，比如方法var foo = function (){};键就是变量名或函数名。

对象的字面值（JSON），JSON是javascript中的表现形式。

var o = {}; //object 对象
alert(typeof o);

输出object

var o = { //自定义对象 JSON
    name:"david",
    age:24,
    sex:"男",
    sayHi:function()
    {
        alert("你好");
    }
};
document.write(o.name);
o.sayHi();

以上自定义对象，这种格式其实就是JSON。

在js当中支持将对象当作数组使用，所以可以类似索引器这样使用：对象[字符串]。

var person = new Object();
person.name = "david";
person.age = 28;
person.sayHi = function(){
    alert("你好,我是"+this.name);
}

document.write(person["name"]); //对象[字符串]

for(var item in person){
    if(typeof person[item] == "function")
        person[item]();
    else
        document.write(person[item]);
}

构造方法

调用的时候使用new 就可以将其作为构造方法来使用

js没有类，直接使用构造方法创建对象。

instanceof判断变量是否是构造方法创建出来的

alert({} instanceof Object); //true;

var Foo = function(){//创建一个函数
    this.name = "david"; //使用this添加
    this.age = 28;
    this.sayHi = function(){
        alert("你好，我是"+this.name);
    };
}; 
var obj = new Foo(); //使用new关键字调用构造方法
alert(typeof obj); //object 不是function
alert(obj instanceof Foo); //true

alert(obj["name"]);
alert(obj.age);
obj.sayHi();

js是支持动态成员的，如果一个对象没有某属性，可以马上为他指定属性

obj.sex = "男"; //本来是没有这个属性的
alert(obj.sex);

类型转换

数字转换为字符串

1、数字+”“

2、数字.toString()

字符串转换为数字

1、字符串-0

2、Number(字符串)

3、parseInt(字符串) parseFloat(字符串)

布尔转换

if(!!var) 双否定 真假不变，但是会自动转换为number

操作字符串

string.indexOf(); 查找字符串

string.lastIndexOf(); 从后找

string.substring(start,stop); 截取

string.replace(); 替换

string.split(); 分割

string.toLowerCase(); 转小写

string.toUpperCase(); 转大写

获取时间

Date(); 获得当前的日期时间

getDate(); 从Date对象获得一个月中的某一天

getDay(); 从Date对象获得一周中的某天

getMonth(); 从Date对象获得月份

getFullYear(); 从Date对象返回四位年份

getHours(); 返回小时

getMinutes(); 返回分

getSeconds(); 返回秒

设置时间

setDate(); 设置日期时间 其他类似

算数

Math.round(4.7) 四舍五入

Math.radom() 随机数 0~1

Math.floor(Math.random()*11) 0~10

错误处理

try{
    /*可能出错的代码*/
}catch{
    /*出错的处理*/
    throw "抛出"
}finally{
    /*无论出错与否，都将执行*/
}