第一章

最新推荐文章于 2024-05-29 14:41:48 发布

原创最新推荐文章于 2024-05-29 14:41:48 发布 · 182 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#js

学习笔记专栏收录该内容

15 篇文章

订阅专栏

第一章

1.JavaScript

1.基本结构
<script type="text/javascript">
    <!—JavaScript 语句;—>
</script >

例：<title>初学JavaScript</title>
</head>
<body>
<script type="text/javascript">
    document.write("初学JavaScript");
    document.write("<h1>Hello，JavaScript</h1>");
</script>
</body>

注：<script>…</script>可以包含在文档中的任何地方，只要保证这些代码在被使用前已读取并加载到内存即可

2.网页引用JavaScript的方式
使用<script>标签

外部JS文件（外部引用）
<script src="外部地址" type="text/javascript"></script>

直接在HTML标签中
<input name="btn" type="button" value="弹出消息框" onclick="javascript:alert('消息');"/>

2.核心语法

1.变量
先声明变量再赋值
例：var width;
    width = 5;

注：var         用于声明变量的关键字
    width       变量名

同时声明和赋值变量
例：var catName= "皮皮";
    var x, y, z = 10;

不声明直接赋值（不推荐）
例：width=5;

2.数据类型
undefined           例：var width;
                    变量width没有初始值，将被赋予值undefined
null                表示一个空值，与undefined值相等
number              var iNum=23;     //整数
                    var iNum=23.0;   //浮点数
boolean             true和false
string              一组被引号（单引号或双引号）括起来的文本
                    例：var string1="This is a string";

3.typeof运算符  
undefined（数值型）              变量被声明后，但未被赋值（默认int）
string（字符型）                 用单引号或双引号来声明的字符串
boolean（布尔型）                true或false
number（浮点型）                 整数或浮点数（默认double）
object（引用数据类型）            javascript中的对象、数组和null

注：Java中需要数据和数据类型一一对应；
    JS中，无视任何数据类型，全部使用 var

4.String对象
字符串对象.length                    读取字符串长度

例：var str="this is JavaScript";
    var strLength=str.length;    //长度是18
    
字符串对象.方法名();

charAt(index)                       返回在指定位置的字符
indexOf(str，index)                 查找某个指定的字符串在字符串中首次出现的位置，若不存在，则返回-1
substring(index1，index2)           返回位于指定索引index1和index2之间的字符串，并且包括索引index1对                                     应的字符，不包括索引index2对应的字符
split(str)                          将字符串分割为字符串数组

5.数组
①创建数组
var  数组名称 = new Array(size);

注：new        表示数组的关键字
    size       表示数组中可存放的元素总数

②为数组元素赋值
var fruit= new Array("apple", "orange"," peach", "banana");    //直接赋值

③访问数组
数组名[下标]

总例：var fruit = new Array(4);
      fruit [0] = " apple ";
      fruit [1] = " orange ";
      fruit [2] = " peach ";
      fruit [3] = " banana ";
      document.write(arr[1]);
    
常用属性和方法
属性
length          设置或返回数组中元素的数目

方法
join( )         把数组的所有元素放入一个字符串，通过一个的分隔符进行分隔
sort()          对数组排序
push()          向数组末尾添加一个或更多 元素，并返回新的长度

6.逻辑控制语句（if ; switch ; for ; while）
if条件语句
if(条件)
{//JavaScript代码;}
else
{//JavaScript代码;}

switch多分支语句
switch (表达式)
{case 常量1 : 
     JavaScript语句1;
     break;
 case 常量2 : 
     JavaScript语句2;
     break;
 ...
 default : 
     JavaScript语句3;    
}

for、while循环语句
for(初始化;  条件;  增量)
 {JavaScript代码; }
while(条件)
 {JavaScript代码;}

for-in
var fruit=[ "apple", "orange", "peach","banana"]; 
for(var i in fruit)
{document.write(fruit[i]+"<br/>");}

7.循环中断
break             退出整个循环
continue          退出当前循环并停止该循环中后续语句的执行，进行下一个循环

例：<script type="text/javascript">
    var i=0;
    for(i=0;i<=5;i++)
    {if(i==3)
      {continue;
      }
    document.write("这个数字是："+i+"<br/>");
    }
    </script>

8.注释
单行注释以//开始，以行末结束
alert("恭喜你！注册会员成功");        //在页同上弹出注册会员成功的提示框

多行注释以 /* 开始，以 */ 结束，符号 /*…… */ 指示中间的语句是该程序中的注释
/*使用for循环运行“document.write("<h3>Hello World</h3>");”5次使用document.write在页面上输出“Hello World” */

9.常用的输入/输出
alert()
例：alert("提示信息");

prompt()
例：prompt("提示信息", "输入框的默认信息");
    prompt("请输入你喜欢的颜色","红色");
    prompt("请输入你喜欢的颜色","");

10.语法约定
代码区分大小写；
变量、对象和函数的名称；
分号

11.统计字符串的个数
需求说明
统计包含“a”或“A”的字符串的个数

3.程序调试

Chrome开发人员工具
停止断点调试；
单步调试，不进入函数体内部；
单步调试，进入函数体内部；
跳出当前函数；
禁用所有的断点，不做任何调试

alert()方法

4.函数

1.常用系统函数
parseInt ("字符串")
将字符串转换为整型数字 
例: parseInt ("86")将字符串“86“转换为整型值86

parseFloat("字符串")
将字符串转换为浮点型数字 
例: parseFloat("34.45")将字符串“34.45“转换为浮点值34.45

isNaN()
用于检查其参数是否是非数字

2.自定义函数
function 函数名( )
    {
     //JavaScript语句
     [return 返回值]
    }

调用函数
函数调用一般和表单元素的事件一起使用，调用格式
事件名＝ "函数名( )" ;

3.调用无参函数
例：调用无参函数，输出5次“欢迎学习JavaScript”
<input name="btn" type="button" value="显示5次欢迎学习JavaScript"  onclick="study( )" />
function study( )
    {
        for(var i=0;i<5;i++)
        {
         document.write("<h4>欢迎学习JavaScript</h4>");
        }
    }
单击此按钮时，调用函数study( )，执行函数体中的代码

4.调用有参函数
例：根据输入的次数，显示“欢迎学习JavaScript“
<input name="btn" type="button" value="请输入显示欢迎学习JavaScript的次数"
 onclick="study(prompt('请输入显示欢迎学习JavaScript的次数:',''))" />
function study(count)
    {
        for(var i=0;i<count;i++)
        {
            document.write("<h4>欢迎学习JavaScript</h4>");
        }
    }
单击此按钮时，调用函数study (count )，执行函数体中的代码

5.变量的作用域
全局变量

局部变量

6.事件
onload              一个页面或一幅图像完成加载
onlick              鼠标单击某个对象
onmouseover         鼠标指导移到某元素上
onkeydown           某个键盘按键被按下
onchange            域的内容被改变