JavaScript

JavaScript

配合html处理一些逻辑.结合安卓开发,JavaScript就相当于我们的class类,html就相当于我们的xml,一个处理逻辑,一个展示界面.今天学一下处理逻辑的JavaScript.
JavaScript语句不能包含html标签,只能是js脚本语言.JavaScript可以写在html中,也可以写在js文件中进行引用.
html中的JavaScript的使用

  • body标签运行就是javascript:+执行语句
<body>
        <a href="javascript:alert('你好!');">运行JavaScript</a>
    </body>
  • head标签script标签包围
<head>
        <meta http-equiv="Content-Type" content = "text/html;charset=utf-8"/>
        <title>JavaScript</title>
        <meta name="author" content = "zxx">
        <meta name="Description" content = "首次进军h5">
        <meta name="keywords" content = "加油">
        <script type="text/javascript">
            alert('直接运行');
        </script>
    </head>

js文件中的JavaScript是使用

  • .js文件把要执行的语句放到.js文件中,然后在head标签中的script中使用src属性将js文件导入即可.
<script src="out.js" type="text/javascript">
        </script>

out.js文件

alert('aksldjf');
  • 在body标签中通过函数的方式,使用js文件中的js脚本
    在js文件创建function函数
alert('aksldjf');
function show(){
    alert('我在Body标签中');
}

在body标签中进行调用

<body>
        <a href="javascript:show()">运行JavaScript</a>
    </body>

变量和数据类型

JavaScript的数据类型是在给变量初始化之后才决定的.变量的定义可以直接给个变量名,然后初始化.也可以通过var来定义变量.但是在使用之前一定要先对变量进行初始化,不然就会提示undefined.变量名的命名规则和java一致.

temp="1245";
alert(temp);
var temp;
temp=12345;
alert(temp);

js中没有equals,两个字符串比较用==如果是比较严格的判断就用===

var temp = null;
var b;
alert(temp==b);

弹出的是true,null和undefined在某种情况下是相等的.如果是===返回的就是false

正则表达式

创建正则的方式

//第一种
var reg = /pattern/;//不要加引号,pattern就是设置的规则
//第二种
var reg = new RegExp('pattern');

RegExp对象的常用方法:
exec(str) 在给定的字符串中检索没有符合正则的字符串,有就返回,没有就返回null.
test(str) 判断给定的字符串是否满足正则条件,满足是true,不满足就是false.

var str="I like football and baskatball";
//var reg=/and/;
var reg = new RegExp('and');
alert(reg.exec(str));
alert(reg.test(str));

正则表达式通配符的使用

. 任意字符
\d 0-9的的数字
\D 非0-9的符号
\s 空白字符
\S 非空白字符
\w 数字,26个应为字母,下划线的单词字符
\W 非以上
\b 是字符串的边界
\B 非….

[abc] 匹配在中括号的的字符
[^abc] 匹配不在中括号中的字符
[a-z] 匹配小写字母
[A-Z] 匹配大写字母
(a|b|c) 匹配abc中的任意一个即可.

正则表达式的量词

n+ 1到多个
n* 0到多个
n? 0到1个
n{m} m个n连续出现
n{m,p} m-p之间的序列
n{m,?} 至少m个
^n 以n作为开头
n$ 以n作为结尾

正则表达式修饰符

  • i 执行对大小写不敏感匹配
  • g 执行全局匹配(查找所有匹配而不是找到第一个就停止)
  • m 执行多行匹配
    i
var str="I like football and baskatball";
var reg = /And/i;
alert(reg.test(str));

通过i忽略大小写,这样返回的值就是true了.
g

var str="BACBCC";
var reg = /B/g;
alert(reg.test(str));
alert(reg.test(str));
alert(reg.test(str));
alert(reg.test(str));

如果不适用g,我们每次查找到的都是第一个B,返回的也都是true.但加上g全局查找后,就会记录上次查找的位置,所以打印结果是true,true,false,true;第三个是false,是因为后面没有了,但是第四次是true,不知道为啥,我也在学习,难道还是一个循环查找不成?这个问题先保留.
m

var str="test\nbbs";
var reg = /^b/m;
alert(reg.test(str));

换行后再进行匹配.

流程控制语句

if,switch,for,while,do-while,for-in循环.和java不同的是多了一个for-in循环

for(变量 in 对象){
    执行语句块;
}

for-in的作用是遍历数组中所有的数组元素.遍历JavaScript对象的所有属性.

var arr = new Array(5);
arr[0]=1;
arr[1]=2;
arr[2]=3;
arr[3]="abc";
arr[5]=true;
for(var index in arr){//打印数组中的元素
    document.write(index+"<br/>");//打印数组的下标
    document.write(arr[index]+"<br/>");//打印数组中的值
}
for(var properties in navigator){//打印对象中的属性值
    document.write("属性:"+properties+",属性值:"+navigator[properties]+"<br/>");
}

常用特殊语句

空语句

没有循环体的for循环,主要用于数组的初始化工作

异常抛出语句

throw new Error(“出错了”);我们通过try-catch-finally对异常进行捕获,但不同于java的是catch只能有一个.输出错误信息e.message;即可.

try{
    var i = 5;
    if(i==5){
        throw new Error("报错了");
    }
}catch(e){
    document.write("错误信息:"+e.message+"<br/>");
}finally{
    document.write("finally<br/>");
}

with语句

可以避免重复书写一些内容,把公共部分提取出来.

with(document){
    write("输出第一行数据<br/>");
    write("输出第二行数据<br/>");
    write("输出第三行数据<br/>");
}

JavaScript函数

JavaScript函数详解

定义函数的3中方式

  • 命名函数
    function 函数名 (参数列表){
    要执行的语句块;
    }

  • 匿名函数
    function (参数列表){
    要执行的语句块;
    }
    调用的话,使用以下方式调用

var f = function(name){
    alert("匿名函数\n你好:"+name);
}
f("h5");

使用function类构造匿名函数

new function(参数列表,函数逻辑);可读性差,很少用.

var f = new Function('name','age',"alert('名字:'+name+',年龄:'+age);");
f("美女",18);

三种方式定义函数

<script  type="text/javascript">
        /*  function user(name ,age){
                alert("姓名:"+name+",年龄:"+age);
            }
            user("张三",23);*/
            var f = function(name ,age){
                alert("姓名:"+name+",年龄:"+age);
            }

            f("李四",14);
            window.f("赵六",16);
            /*var f = new Function('name' ,'age','alert("姓名:"+name+",年龄:"+age);');
            f("王五",25);*/
        </script>
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章