当前位置:阳光沙滩 >前端 > 查看文章
阿里云优惠码

1.1、JavaScript介绍

JavaScript:它早期的出现主要是为了解决运行在浏览器上的数据的验证问题。Javascript需要运行在浏览器中。Javascript是一门脚本语言。

 

什么是javascript?

JavaScript被设计用来向HTML页面添加交互行为。

JavaScript是一门脚本语言,也就是轻量级的编程语言。

JavaScript由数行可执行的计算机代码组成

JavaScript通常嵌套在html文件中

所有的人无需购买就可以使用javaScript

 

那么javajavaScript相同吗?

答案是不同的,java和javascript就像一个同名但不同姓的两个人一样。为什么名字差不多呢,主要是在形式上差不多。当然也是有一定的历史的,这里就不瞎扯了哈。

 

  • java是面向对象的编程语言,而javascript是基于对象的语言。
  • java是一门强类型语言,JS是一门弱类型语言。
  • java需要编译,交给JVM运行;JS编程代码不需要编辑,直接交给浏览器执行。

2. 2、JavaScript与Html结合方式

2.1.第一种方式

直接在html标签中嵌入JS代码

<script type = “text/javascript”>//JS 代码一般写在head中
 alert("hello sunofbeaches.com");
</script>

把JS代码单独写成一个文件,然后通过代码引入即可,例子如下:第二种方式


<!--引入外部代码 PS:如果引入了外部的JS代码,那么这个标签就不能再写其他的JS代码了,写了也不会执行的--><script type = "text/javascript" src = "cssForDemo.css"></script>

 

3.3、JS中的注释

Java中的注释有:

单行注释//注释内容

多行注释:/**/注释内容

文档注释:/**注释内容      */

 

JS中的注释只有单行注释和多行注释:

单行注释//注释内容

多行注释:/**/注释内容

 

 

4.4、关键字、标识符

关键字:什么是关键字呢?

其实关键字就是被JS这门语言赋予了特殊含义的单词或者符号

例如 var        if      for    break        continue等

标识符:我们开发人员根据程序 的需求自己定义的一些:

变量名,数组名,函数名,对象名等

 

规定:只能用数字、字母、下划线、$符号,但不能以数字开头

 

5.5、常量

在程序中一些不变的的数据,称为常量。

5.1.1.Java中的常量分类:

数字:整数和小数

字符:使用单引号引用

字符串:是欧诺个双引号引用

布尔值:true和false

Null值:null

 

5.1.2.那么在JS中的常量分类

数字:不分整数和小数

字符串:使用单引号或者双引号引用

布尔值:true和false

Null值:null

Undifined:undefined

 

进制转换,在JS中也是和JAVA中一样的,都是支持进制转换的。

 

6.6、变量

变量:表示的是一个内存空间

Java中的数据类型:

  • 基本数据类型:byte short int long double float char boolean
  • 引用数据类型:数组 对象 接口 枚举 等等

 

JS中的数据类型

  • 数字类型:number
  • 字符串类型:string
  • 布尔类型:boolean
  • Undefined:undefined
  • Null:null

 

Java中定义变量的格式:

变量类型 变量名;

变量类型 变量名 = 值;

JS中定义变量的格式:

Var 变量名

Var 变量名 = 值;

/*JS中定义变量:变量如果定义没有复制,这时会显示undefinedJS的变量定义好之后,如查没有赋值,那么空间

是没有类型的,只有在赋值之后,才能知道当前

这个空间的具体类型。

可以使用typeof()测试这个空间的类型

 

*/

//定义变量

var a;

a = 123;

alert(typeof(a));

a = true;

alert(typeof(a));

7.7、运算符算术运算符

算术运算符:+、-、*、/、++、­­–、%

 

这里比较特殊的呢是这相加号运算符(+)

 

它可以作这个联接的效果,也可以进行相加,如果学过JAVA的同学们,肯定会崩溃的哈,嘻嘻!

 

把下面的代码复制到你的浏览器里面测试一下吧,或者我在代码下面注释出这个结果吧,哈哈!

/*算术运行:JS中不区分整数和小数 

字符串和其他数据使用+号链接时,会得到一个更长的

字符串

 

如果使用算术运算(除了+号之外)和字符串进行运算,如果这个字符串

表示的是数字字符串,那么在运算时就会把这个字符串变成这个数字再

进行运算。

如果这个字符串无法转换成这个数字的话,那么就会得到一个NaN

表示当前这个结果不是一个数字的意思,同学们可以写写代码哦!太简单了!

 

*/

 

var num = 1234;

alert(num/100*100)

 

//因为不分整数和小数,所以呢,结果还是:1234

 

 

//变成一个更长的字符串

var str = 4;

alert(str+”5″);//结果是:45

 

var dig = 12;

alert(dig * “10”);//结果是120

7.1.8.1赋值运算

=赋值符号:意思大概是把右边的值赋给左边的空间(变量)

3=3;//这是不对的,这是不科学的,这是不可行的,因为这个左边不是变量呀!

除此之外,还有那些呢,哈哈!

+=     -=      *=   /= 相信这些意思同学们都懂了吧,和JAVA是一样的哦。其实和大多数编程语言都一样吧。

 

7.2.8.2、关系(比较)运算

7.2.1.比较一下吧!(java-JS)

1、JAVA的比较运算:>         <       >=     <=     ==     !=

2、JS中的比较运算符号:>         <       >=     <=     ==     !=    ===(恒等、绝对等)

7.2.2.代码时间到!

其实呀,这个跟JAVA没有太多的不同吧,是吗,就是有一个恒等哈,为什么呢,因为呀,JS里头没有equals,哈哈!

 

好吧,看代码吧!

/*比较运算代码*/ 

var a = 2;

var b = “2”;

var c = 3;

var d = 2;

 

alert(a==b);//true

alert(a===b);//false

alert(a===c);//true

alert(a>b);//true

7.3.8.3、逻辑运算

再对比一下吧,嘻嘻!

1、JAVA中的逻辑运算符:&      && |       ||     !        ^

2、JS中的逻辑运算符:&& ||   !另外几个是位运算符

 

/*逻辑运算:在JS中如果运算过程中遇到了    非零、非null、非undefined 我们都在程序中认为它是真值(true)

 

如果遇到了 零、null、undifined都可以认为是假值(false)使用。

 

*/

 

var a = “abc”;

var b = 12;

 

alert(a&&b);//abc

alert(a||b);//abc

 

//根据上面的说明理解一下吧,很简单的。

7.4.8.4、位运算

位运算符号有:&  |  ^   ~  <<  >>  >>>

这些跟这个JAVA是一样的哦,很简单的,转换成二进制再进行运算。

 

7.5.8.5、三目(三元)运行符

格式:

表示式一?表达式1:表达式2;

如果表达式一为true,则返回表达式1的结果;

如果表达式一为false,则返回表达式2的结果;

 

8.9、语句

JS中的语句:判断语句;选择语句;循环语句;

 

这些都和这个JAVA一样的,那么我就不写了哈,嘻嘻!

我就写一个循环的例子吧,嘻嘻,这个面试可能会有写哦,其实很简单的,喜欢写代码的同学们都觉得面试题目很好玩,特别谷歌,微软这些公司的。很有意思,当然,这个九九乘法表不是哈。

         for(var i = 1;i<10;i++){for(var j = 1;j<=i;j++){document.write(i+”*”+j+”=”+(i*j)+”&nbsp;”);}

document.write(“<br/>”)

}

9.10、JS中的消息框

JS中可以创建三种消息框:警告框、确认框、提示框

9.1.1.1.警告框;我们前面一真在用,嘻嘻!alert();

警告框经常用于确保用户可以得到某些信息。

当警告框出现后,用户只有点击确定键才能继续进行操作

语法:Alert(“文本”);

9.1.2.2.确认框:这个确认框可以用于验证或者让用户确定信息

  1. 确认框出现后,用户需要点击确定或者取消按钮才能进行操作;
  2. 如果用户点击了确定,则返回true,如果点击取消则返回
语法:comfirm(“文本”)

 

         /*确认框:confirm 在页面上主要让操作者进行选择程序根据操作者的选择给出不同的处理。

这种应用主要在网银转账,在弹出确认框之后,需要操作者选择操作

方式。如果确定了,则转账,否则就取消。此时窗口有一定的责任。

*/

 

var value = confirm(“你确定吗?”);//确定返回true,取消返回false

 

if(value){

document.write(“转账成功!”);

}else{

document.write(“转账失败!”);

}

9.1.3.3.提示框:经常用于提示用户在进行页面前输入某值。

当提示框出现后,用户需要输入某个值,然后点击确认或者取消才能进行操作。

如果用户点击确定,则返回输入的值,否则就返回null。

语法:prompt(“文本”,”默认值”)
         /*提示框:prompt(“文本”,”默认值”)*/

var val = prompt(“请输入密码”,”123456″);//默认值可以不填

//对值进行判断

if(val==”password”){

alert(“欢迎访问空间相册”);

}else{

alert(“密码错误”);

}

10.11、 函数(方法)

在JAVA中我们把函数叫做方法,在C语言中我们叫函数,其实这个方法跟函数的意思一样。

函数的作用:封装可以独立运行的代码,在需要的时候可以对函数进行调用,实现某一个功能。

JAVA中的函数定义格式:[修饰符] 返回值 函数名(形参1,形参2….){函数体}

那么在JS中是怎么定义这个函数的呢?

下面就列一下格式吧:

10.1.1.第一种函数定义方式:

function   函数名(形参1,形参2….){函数体}

代码体现:

/*函数定义格式function 函数名{函数体

}

 

JS中定义函数的细节:

函数必须被调用才能被执行;

JS中的函数如果接收数据,但是在调用的时候可以传递和参数不一致的实参数据;

JS中的函数没有重载概念,如果在JS中的前后出现同名的函数,后面的函数会覆盖前面的函数;

JS中函数不需要写返回类型,可是可以在函数体中用return返回值;

如果直接把函数名赋值给一个变量,那么,这个变量就是一个函数,当我们调用的时候,可以通过这个

变量名来调用,在后面加上()即可。

在JS中有一个特殊的参数接收所有的实参,这个形参是arguments。它是一个数组,用于接收数据。

*/

//第一个函数

function demo(){

alert(“hello sunofbeaches.com”);

}

//调用函数

demo();

function demo2(a,b){

alert(a+”….”+b);

}

demo2(12,34);

function demo3(a,b){

return a+b;

}

var temp = demo3(2,4);

document.write(temp+”</br>”);

10.1.2.第二种定义方式:

在JS中一个内置对象Function,我们可以通过这个Function对象创建出对象。

格式:

var  函数名 = new Function(“形参名”,”方法体”);

说实话,这玩意很少人用,哈哈,你想一下嘛,方法体写在一个字符串里,谁喜欢呀?是吧,下面就写一个例子吧,看看到底有多恶心吧!

var demo = new Function(“a”,”b”,”return a+b”);
//等价于function demo(a,b){return a+b;}

10.1.3.第三种函数定义格式:匿名函数

匿名函数:格式

function(参数列表){
函数体

}

那问题就来了,哈哈,到底怎么调用呢?

其实是这样的哈,匿名函数主要需要和JS中的事件绑定在一起使用。

页面加载完成之后,会自动触发加载完成的时间:onload

//在窗口把当前的HTML文件加载完成之后,直接执行函数window.onload = function(){document.write(“<a href = ‘http://sunofbeaches.com’ target = ‘_blank’>阳光沙滩</a>”);}

11.12、 数组

关于数组的扯蛋:

数组用于存储数据。数组名、下标(或者叫角标吧)、长度

操作:遍历,增删改查。

 

JAVA中的数组主要定义格式:

数据类型[] 数组名 = new 数据类型[数组长度];

数据类型[] 数组名 = {元素1,元素2…..};

 

在这个JS中的定义数组有两种方式,JS中的数组长度是可以变化的哦,可以理解为JAVA中的集合,但是呢,不需要定义类型。

 

11.1.1.JS中数组的第一种定义方式:

var 数组名 = [元素1,元素1,….];

/*数组的定义格式:JS中的数组长度是长度可以改变的,可以理解成JAVA中的集合。在数组里存放的类型可以是不同的

*/

var arrays = [1,3,5,”abc”,”naa”,”cba”,true,false,null,undefined];

 

document.write(arrays[0]);

document.write(arrays[4]);

 

arrays[5] = 123;

alert(arrays[5]);

 

arrays[20] = “这里是第21号元素”;

 

alert(arrays[19]);

 

alert(arrays.length);

来几个练习吧,比如说,遍历,排序。

//弄一个函数来打印数组吧function printArrays(arrays){document.write(“[“);

for(var i = 0;i<arrays.length;i++){

if(i!=arrays.length-1)

document.write(arrays[i]+”,”);

else

document.write(arrays[i]+”]”+”</br>”);

}

}

 

//搞一个数组

var arrays = [12,34,53,23,42];

 

/*

排序,排序最常用的有冒泡排序吧,还有这个选择排序

如果对这两种算法不熟悉的话,可以到网站里看看哦,

我画图画得很详细的哈,嘻嘻!你看了之后绝对懂的哈!

*/

 

//冒泡排序

function bubbleSort(arrays){

for(var i = 0;i<arrays.length;i++){

for(var j = 0;j<arrays.length-i-1;j++){

if(arrays[j]>arrays[j+1]){

var temp = arrays[j];

arrays[j] = arrays[j+1];

arrays[j+1] = temp;

}

}

}

}

 

//排序前输出一次

printArrays(arrays);

 

//进行排序

bubbleSort(arrays);

 

//排序后再输出一次

printArrays(arrays);

加载到HTML中的运行结果:[12,34,53,23,42]
[12,23,34,42,53]

其他练习自己写一下吧,很简单的,如果不会的话,请到我们的阳光沙滩社区里头提问吧,加油,嘻嘻!

11.1.2.JS中数组的第二种定义方式:

这一种的话,需要用到一个对象,Array

格式如下:

使用Array对象创建数组

格式:

var 数组名 = new Array(元素or长度);

在使用Array对象创建数组的时候,如果指定了多个值,这些数据就是数组的元素

如果指定一个正整数值 ,这个值是数组的长度。

如果你要存放一个正整数,可以用变量或者用第一种数组定义方法。

var arrays = new Array(12,34,true,false,undifined);
var arrays = new Array(12,34,true,false,undefined);//弄一个函数来打印数组吧function printArrays(arrays){

document.write(“[“);

for(var i = 0;i<arrays.length;i++){

if(i!=arrays.length-1)

document.write(arrays[i]+”,”);

else

document.write(arrays[i]+”]”+”</br>”);

}

}

printArrays(arrays);

 

本文链接:http://blog.sunofbeaches.com/archives/117 转载请注明出处.
如果喜欢:点此订阅本站
7K
相关文章
为您推荐
各种观点