JavaScript概述
JavaScript是基于对象和时间的脚步语言.主要应用在客户端.
特点:
1.交互性(他可以做的就是信息的动态交互)
2.安全性(不允许直接访问本地硬盘)
3.跨平台性(只要是可以解释JS的浏览器都可以执行.和平台无关)
-------------------------------------------
JavaScripet与java的不同
1.JS是Netscape公司的产品,前身是LiveScript;java是sun公司;现在是Oracle公司的产品
2.js是基于对象,java是面向对象.
3.js只需要解释就可以执行.java需要先编译成字节码,在执行.
4.js是弱类型.java是强类型.
-----------------------------------------------
JavaScript与Html的结合方式
想要将其他代码融入到html中,都是以标签的形式.
1.js代码存放到标签对<script>....</script>.
2.使用script标签的src属性引入一个js文件.(方便与以后维护和扩展)
列:<scritp src="text.js" type="javascript"></script>
注意:规范中script标签中必须假如type属性.
-------------------------------------------------
javascript的语法
每一种语言都有自己的语法规则,js的语法与java很像.所以学习起来比较容易,js中也一样
有变量语句,函数.数组等常见语言组成的元素.
1. 变量
通过关键字var来定义,弱类型就可以不用指定具体的数据类型.
示例: var x = 3; x="hello";
注意:js中特殊的常量值:undefined,当变量没有初始化就被使用,该变量的值就是undefined(未定义)
---------------------------------------------------
语句(与java语句格式相同)
判断结构(if)
注: var x=4;
if(x==4)
if(x=4)
示例:
var x = 3;
if(3=x)
alert("yes");
else
alert("no")
选择结构(switch)语句
循环结构(while语句 , do while语句, for语句)
示例:
while(x<3){
alert("x="+x);
x++;
}
注:不同的是.没有了具体数据类型的限制,使用时要注意.
练习:
打印一个99乘法表.用表格形式
table{
<!--让内线和外线重合-->
border-collapse:collapse;
<!--设置框的长度-->
width:600px;
}
table th{
<!--设置内框的颜色和宽度 还有可见度-->
border:#FF0000 1px solid;
}
</style>
</head>
<body>
!<--打印一个99乘法表-->
<script type="text/jscript">
<!--document相当于打印语句-->
document.write("<table>")
for(var x= 1 ; x<=9; x++){
document.write("<tr>");
for(var y= 1 ; y<=x ; y++){
document.write("<th>"+y+"*"+x+"="+x*y+"</th>")
}
document.write("</tr>")
}
document.write("</table>");
----------------------------------------------
javascript数组
方便与操作多元素的容器.可以对其中的元素进行编号
特点:可以存任意元素,长度是可变的.
格式:
var arr = new Array();
arr[0] = "hello";
arr[1] = 123;
var arr =['hello',123,true,"abc"]
---------------------------------------------
javascript函数
1.一般函数
格式
function 函数名字(形式参数...)
{
执行的语句
返回值
}
函数时多条执行语句的封装体.只有被调用才会被执行.
注意:调用有参数的函数,但是没有给期传值.韩式一样可以运行,或者调用没有参数的函数,
给其他传值,该韩式也一样运行,是有货的简单点:只要写了韩式名后面跟了一对小括号,
该韩式就会运行,那么传递的参数呢?
其实,在函数中有一个擦哪壶数组对象(arguments),该对象将传递的参数都封装在一个数组中
示例:
function demo()//定义函数
{
alert(argument.length);
}
demo("hello",123,true)//调用函数.
为了增强阅读性,最好按照规范,按定义好的形式参数传递实际参数.
韩式在调用时的其他写法:
var show = demo();//show变量接收demo函数的返回值.
var show = demo;//这种写法也是可以的.以为show和demo代表同一个函数.
//那么该函数也可以通过show()的方式运行.
2.动态函数
通过js\的内置对象function实现
示例:
var demo = new function("x,y;alert(x+y);");
demo(3,6);
如同:
function demo(x,y)
{
alert(x+y);
}
demo(4,6);
不同的是,动态函数,参数已经函数体都可以通过参数进行传递,可以动态指定/.
3.匿名函数
格式:function(){....}
示例:
var demo = function(){...}
demio();
通常在定义时间属性的行为时比较常用.
例如:
function test()
{
alert("load ok");
}
window.onload = test;
可以写成匿名函数的形式:
window.online = function()
{
alert("load ok")
}
------------------------------------------------------------
JavaScript 中的对象.
示例1:
function Pershon()
{
alert("load run")
}
var p = new Pershon();
p.name = "zhangsan";
p.age = 20;
p.chifan = function()
{
alert("吃饭");
}
p.chifan();
示例2:
function Person(nhame,age)
{
this.name = name;
this.age = age;
}
var p = new Person("孙百鑫",21);
alert(p.name+"..."p.age);
//第二种方式调用
alert(p.["name"]+"...."+p.age);
示例3:
要运行的html
<script type="text/jscript" src="Person.js"></script>
<script type="text/jscript">
alert(p.name+":"+p.age);
p.chifan();
alert(p.getName());
定义的person.js对象
// JavaScript Document
function Person(name,age)
{
this.name =name;
this.age = age;
}
var p = new Person("lisi",20);
p.chifan = function()
{
alert("chifan");
}
p.getName = function()
{
return p.name;
}
示例4:
//需要导入定义好的对象
<script type="text/javascript" src="Arraytool.js"></script>
var arr = [3,6,4,9,7,10];
//将数组传入到定义好的方法中
var a = ArrayTool.getMax(arr);
//返回最大值
alert("max="+a);
js
// JavaScript Document
function ArrayTool(){};//这个相当于定义一个类
var Arraytool = new ArrayTool();//这个相当于实例化那个类
ArrayTool.getMax =function(arr)//也可以定义内部类
{
var max = arr[0];
for(var x = 1 ; x<arr.length; x++)
{
if(max<arr[x])
max = arr[x];
}
return max;
}
ArrayTool.getMax =getMax;//让定义的对象和方法产生关系
function getMax(arr)
{
var max = arr[0];
for(var x = 1 ; x<arr.length; x++)
{
if(max<arr[x])
max = arr[x];
}
return max;
}
------------------------------------------------
javascript 中的原型
原型是什么.简单一句话就是让一个对象本身具备了一些处理数据的方法
比如数组.的获取最大值最小值.原型的关键字是prototype
示例:
让数组的原型具备可以获取最小值的方法.
<script type="text/jscript" src="arrayutil.js"></script>//导入js文件
<script type="text/jscript">
var arr = [5,4,6,7,9,13];
alert("min="+arr.getMin());
</script>
//js中的代码
Array.prototype.getMin = function()
{
var min = this[0];
for(var x = 1; x<this.length; x++)
{
if(min>this[x])
min = this[x];
}
return min;
}
示例:
通过原型可以让对象之间产生父类关系.好比java中的继承.
<script type="text/jscript" >
function Person(name){//创建人的对象,相当于私有化一样
this.name = name;
}
Person.prototype.setName = function(name){//让人的原型就具备set方法类设置学生的名字.
this.name = name;
}
Person.prototype.getName = function(){//让人的原型具备get方法设置学生的名字.
return this.name;
}
var p = new Person("zhangsna");//创建父类对象
function Student(){};//建立学生类
Student.prototype = p;//让学生类的原型是Person.这样就相当于继承了.主要就是这句话.让两个对象之间有了关系.
var s = new Student();//创建学生对象.
s.setName("lisi");//就可以使用继承过来的setName方法来进行设置了
alert(s.getName());//显示在窗口上.
</script>
用子类也可以覆盖父类的参数.
<script type="text/jscript" >
function Animal(name){
this.name = name;
}
Animal.prototype.setName = function(){
this.name = name;
}
Animal.prototype.getName = function(){
return this.name;
}
Animal.prototype.eat = function(){
alert("吃东西");
}
var animal = new Animal("动物");
function Cat(){};
Cat.prototype = animal;
Cat.prototype.eat = function()//相当于覆盖了父类的吃的方法
{
alert("吃鱼");
}
var cat = new Cat();
cat.eat();//调用吃的方法
-----------------------------------------------------------------------------------
javascript中的for in方法 和with语句
可以获取对象中的属性.也可以获取数组中的元素.
获取属性示例:
function Person(){
this.name = "张三";
this.get = 26;
this.getName = function(){
alert(name+"...."+age);
}
}
var p = new Person();
//alert(p["name"]);
for(x in p){
alert(x+":"+p[x]);
}
获取数组的元素示例:
var arr=[3,6,4,8,6];
for(x in arr)
{
alert(arr[x]);
}
with语句示例:
with(对象)
{
可以直径使用该对象的功能.
}
去定了该对象作用的范围,在繁重内,可以直接使用该对象的方法
var date = new Date();
with(date){
alert(getYear()+"年"+(getMonth()+1)+"月"+getDate()+"日");
}
with(Math)
{
alert((random()))
}
714
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
