昨天是初学js的第一天,为什么今天才写,我觉得这样可以帮助我复习昨天的知识,加深对js的理解。
我之前学过java的,昨天转入js的学习,对js略有些体会和大家分享下,js刚入门感觉js相对于java也没有什么难的,声明变量只需要用var就行了,同一变量名能代表不同变量的值之类的。
昨天主要学了js三种导入html的方法、js书写规范、变量的基本使用、变量提升。
***********************************************************************************************正文******************************************************************************************************************************
三种将js导入到html代码中的方法:行内脚本(不推荐)、内嵌脚本、外部脚本。
行内脚本:
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>行内脚本</title> <!-- 该导入js的方式不推荐 --> </head> <body onload="alert=()"> </body> </html>
内嵌脚本
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>内嵌脚本</title> <script type="text/javascript"> alert('我是head脚本'); </script> </head> <body> <script type="text/javascript"> alert('我是body脚本'); </script> </body> </html>
外部脚本
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>外部脚本</title> <script type="text/javascript" src="js/new_file.js"> </script> </head> <body> </body> </html>
alert('我是外部脚本');
二、js书写规范
js的书写规范和java差不多的。
* js区分大小写
* 关键字(保留字)若是大小写书写不同,浏览器控制台会报错。
* var可以声明所有的变量的类型
* 代码行需要以分号结尾(不是必须的,为了防止系统加错分号,还是加上分号比较好)、
* 所有的符号必须使用英文下的
* js可以用注释代码
* 单行注释:/
* 多行注释:/**/
三、变量的基本使用
js和java的变量声明赋值使用都是差不多一样的,有些不同的是js的声明变量类型只需要用var,而java需要int、double之类的;js的同一变量名可以赋不同类型的值,而java不可以java的变量具有唯一性。
//变量声明
/**
* 语法:
* 1、var 变量名;变量名=初始值;
* 若变量名没有赋初始值时,consol.log(money),会输出undefined(默认值);
* 2、var 变量名 =初始值 ;
* var可以去掉(不推荐)[使用严格模式时,必须要加var]
*/
变量名命名规范
* 组成:字母、数字、下划线、$,首字符不可以是数字(和Java命名规范相同)
* 变量名命名要有意义,方便后期;
* 不能使用关键字(保留字)
* 命名方法:
* canel:驼峰命名法:首个单词的首字母为小写,其他单词首字母为大写,firstName,
* pascal:帕斯卡命名法:每个单词的首字母都是大写,FirstName;
//变量赋值 /**
* 语法:
* 可以在变量声明时赋值,(var 变量名 =初始值 ;) * js中同一变量名可以赋不同类型的值。 */
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>变量的基本使用</title> </head> <body> <script type="text/javascript"> //变量声明 /** * 语法: * 1、var 变量名;变量名=初始值; * 若变量名没有赋初始值时,consol.log(money),会输出undefined(默认值); * 2、var 变量名 =初始值 ; * var可以去掉(不推荐)[使用严格模式时,必须要加var] */ var money; /** * 变量名命名规范 * 组成:字母、数字、下划线、$,首字符不可以是数字(和Java命名规范相同) * 变量名命名要有意义,方便后期; * 不能使用关键字(保留字) * 命名方法: * canel:驼峰命名法:首个单词的首字母为小写,其他单词首字母为大写,firstName, * pascal:帕斯卡命名法:每个单词的首字母都是大写,FirstName; */ //变量赋值 /** * 语法: * 可以在变量声明时赋值,(var 变量名 =初始值 ;) * js中同一变量名可以赋不同类型的值。 */ money=10000; //变量计算 money=money+money*0.04; //变量使用 console.log(money); </script> </body> </html>
四、变量提升
变量提升:编译器在编译js脚本时,把所有变量提升到脚本 的最上面。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>变量提升</title> </head> <body> <script type="text/javascript"> /** * 当单独运行console.log(s)时程序会报错; * 在console.log(s)下面对s进行声明变量并赋初值,再次输出s; * 在控制台中,第一次输出s为默认值(undefined),第二次输出s为:“我只是一个s”; * 这样就进行了变量提升。 * 变量提升:编译器在解释js脚本时,会把所有的变量全部提升到脚本的最上面 */ console.log(s); var s = '我只是一个s'; console.log(s); /** * 变量提升相当于: */ var s; console.log(s); s = '我只是一个s'; console.log(s); </script> </body> </html>
/**
* 当单独运行console.log(s)时程序会报错;
* 在console.log(s)下面对s进行声明变量并赋初值,再次输出s;
* 在控制台中,第一次输出s为默认值(undefined),第二次输出s为:“我只是一个s”;
* 这样就进行了变量提升。
* 变量提升:编译器在解释js脚本时,会把所有的变量全部提升到脚本的最上面
*/
五、一个便于理解js变量的一个小项目。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>js一个小项目</title> </head> <body> <script type="text/javascript"> //<!--js代码执行从上往下执行--> /*功能实现 * 向银行存入10000元,利息4%,存储一年算本金和; */ //存入10000元 var money=10000; //计算本金和 money=money+money*0.04; //输出结果 console.log('本金和'+money) </script> </body> </html>