【JavaScript基础】------有待完善

最近开始学习JavaScript,整理了一些相关的基础知识,日后继续完善~~~

JS注释方式:
// 单行注释(Ctrl+/ )
/*
段落注释(Ctrl+shift+/ )
*/

JavaScript基础
JavaScript:
基于浏览器 、基于(面向)对象、事件驱动、脚本语言
JavaScript的作用:
表单验证,减轻服务的压力,添加页面动画效果,动态更改页面内容,Ajax网络请求(Ajax:可以实现页面局部刷新)
JavaScript组成部分;ECMAScript(5.1/6)、DOM、BOM
ECMAScript脚本程序语言:
语法标准:语法;变量和数据类型;运算符;逻辑控制语句;关键字、保留字;对象
DOM文档对象模型
BOM浏览器对象模型

JavaScript的基本结构:
<script type="text/javascript">
JS语句;
</script>

变量的声明和变量:
先声明变量再赋值:
var width; width=5;
var——用于声明变量的关键字;width——变量名
...
同时声明变量和赋值
不声明直接赋值

【使用JS的三种方式】

1、HTML标签中内嵌JS;
<button onclick="alert(‘小样你真点啊!‘)">有本事点我呀!!!</button>
2、HTML页面中直接使用JS:
<script type="text/javascript">
JS语句;
</script>
3、引用外部JS文件:
<script language="JScript" src="JS文件路径"></script>

【注意事项】
1)页面中JS代码与引用JS代码,可以嵌入到HTML页面的任意位置。但是,位置不同会影响到JS代码的执行顺序;
例如:<script>在body前面,会在页面加载之前执行JS代码;
2)页面中JS代码,使用type="text/javascript"
引用外部的JS文件,使用language="JScript"
3)引用外部JS文件的<script></script>标签,必须成对出现,且标签内部不能有任何代码!

【JS中的变量】
1、JS中变量声明的写法:
var width = 10;//使用var声明的变量,只在当前函数作用域有效
width1 = 11;//不适用var,直接赋值生成的变量,默认为全局变量,整个JS文件有效
var a,b,c=1;//同一声明语句同时声明多个变量,变量之间用英文逗号分隔,但是,赋值需要单独赋值,例如上式中,只有c赋值为1,a b为undefined(未定义)。

【声明变量注意事项】
1)JS中所有变量类型声明,均使用var关键字。变量的具体数据类型,取决于给变量赋值的执行。2)同一变量可在多次不同赋值时,修改变量的数据类型
var width = 10;//width 为整型变量
width="hahaha";//width 被改为字符串类型
3)变量可以使用var声明,也可以省略var,[区别]不使用var,默认为全局变量
4)同一变量名,可以多次用var声明,但是并没有任何含义,也不会报错,第二次之后的声明,只会被理解为赋值。

2、变量的命名规范
1)变量名,只能有字母,数字,下划线,$组成
2)开头不能是数字
3)变量区分大小写,大写字母与小写字母为不同变量

3、变量命名名要符合驼峰法则:
变量开头为小写,之后每个单词首字母大写;
XiaoXiZhenMeng √
xiao_xi_zhen_meng √
xiaoxizhenmeng ×

4、JS中的变量的数据类型
Undefined:未定义,用var声明的变量,没有进行初始化赋值。var a;
Null:表示为空的引用。var a = null;(其中一种情况)eg:空对象,空数组。。。
boolean:真假,可选值true/false
Number:数值类型。可以是小数,也可以是正数。
String:字符串类型。用""和‘‘包裹的内容,称为字符串。
Object(复杂数据类型):后续讲解,函数、数组等。。。

5、常用的数值函数:
1)isNaN:用于判断一个变量或常量是否为NaN(非数值)
使用isNaN判断时,会尝试使用Number()函数进行转换,如果能转换为数字,则不是非数值,结果为false
"111" 纯数字字符串,false "" 空字符串,false "la" 包含其他字符,true
true/false 布尔类型,false
2)Number():将其他类型转换为数值类型
[字符串类型转数值]
>>字符串为纯数值字符串,会转为对应的数字"111"->111
>>字符串为空字符串时,会转换为0 ""->0
>>字符串包含其他非数字字符时,不能转换 "111a"->NaN

[布尔Boolean类型转数值]
true->1 false->0

[null/Undefined转数值]
null->0 Undefined->NaN

[Object类型转数值]
(以后再了解哦~)先调用ValueOf方法,确定函数是否有返回值,再根据上述各种情况判断。
3)parseInt:将字符串转成数值
>>>空字符串,不能转。结果为NaN
>>>纯数值字符串,能转。"123"->"123" "123.5"->123(小数转化时,会直接抹去小数点,不进行四舍五入)
>>>包含其他字符的字符串,会截取第一个非数值字符串前的数值部分。"123a456"->123 "a123b345"->NaN
>>>parseInt只能转String类型,Boolean/null/Undefined 均为NaN
4)parseFloat:将字符串转为数值
>>>使用方式同parseInt,但是,当转化小数字符串时,保留小数点;转化整数字符串时,保留整数;
"123.5"->123.5 "123.0"->123
5)typeOf:用来检测变量类型
未定义—>Undefined 字符串->string true/false->boolean 数值->Number
对象/null->Object 函数->function

【JS中的输出语句】
document.write();
输出语句,将write的()中的内容打印在浏览器屏幕上
使用时注意:除变量/常量以外的任何内容,打印时必须放在""中,变量/常量必须放到""外
打印的内容同时有多部分组成,之间用“+”链接
例如:document.write("输出互换前手中的纸牌:"+left+"<br />");
alert();弹窗警告

1、【算术运算】
+ 加、- 减、* 乘、 / 除、 % 取余、++ 自增、-- 自减

+:有两种作用,链接字符串/加法运算;当+两边均为数字时,进行加法运算;
当加号两边有任意一边为字符串时,进行字符串链接,链接之后的结果认为字符串
++:自增运算符,将变量在原来基础上+1;
--:自减运算符,将变量在原来基础上-1;

*【n++ 与 ++n 的异同】
* n++:先使用n的值进行计算,然后再把n+1;
* ++n: 先使用n的值+1,然后再用n+1以后的值,去运算;
* 相同点:不论是n++还是++n,在执行完代码以后,均会把n+1;
* eg: var a = 3;
var b,c;
b = a++ +2; //a=3 b=5 c=4
c = ++a +2; //a=4 b=5 c=7

document.write("a:"+a);
document.write("b:"+b);
document.write("c:"+c);

2、赋值运算
= 赋值、 += -= *= /= %=
+=:a += 5;相当于a = a + 5;但是,前者的执行效率要比后者快,

3、关系运算
== 等于、=== 严格等于、 != 不等于 、>、<、>=、<=

===:严格等于;类型不同,返回false;类型相同,再进行下一步判断
==:等于;类型相同,同===;类型不同,尝试将等式两边转为数字,再判断;
特例:null==Undefined √ ; null===Undefined ×

4、条件运算符(多目运算)
a>b?true:false

有两个关键符号:?和:
当?前面的部分运算结果为true时,执行:前面的代码;
当?前面的部分运算结果为false时,执行:后面的代码;

>>>多目运算符可以多层嵌套:
例如:var jieguo =

5、逻辑运算符
&& 与、|| 或、! 非

6、【运算符的优先级】
()
! ++ --
% / *
+ -
> < >= <=
== !=
&&
||
各种赋值= =+ *= /= %=

【if-else结构】
1、结构写法:
if(判断条件){
//条件为ture时执行
}else{
//条件为false时执行
}
2、if()中的表达式,运算之后的结果应该为:
1)Boolean:true 真 ; false 假
2)string:非空字符串为真 ;空字符串为假
3)Number:0为假 ;一切非0均为真
4)Null/NaN/Undefined:全为假
5)Object:全为真
3、else{}结构,可以根据具体情况省略;

【多重if、阶梯if】
1、结构写法:
if(条件一){
//条件一成立
}else if(条件二){
//条件一不成立&&条件二成立

//else if 部分,可以有多个
}else{
//条件一不成立&&条件二不成立
}

2、多重if结构中,各个判断条件是互斥的,只能选择其中一个
3.if/else的大括号可以省略,但不提倡,如果省略,
则if/else包含的代码只包括其后最近的一行(分号结束);
else结构永远属于其前方最近的一个if结构。

【嵌套if结构】
1、结构写法:
if(条件一){
//条件一成立
if(条件二){
//条件二成立
}else{
//条件为false时执行
}
}else{
//条件为false时执行
}
2、if结构可以多重嵌套,但是原则上不超过三层

【Switch-Case结构】
1、结构写法:
switch(表达式){
case 常量表达式1:
语句一;
break;
case 敞亮表达式2:
语句二;
break;
。。。
default:
语句N
}
2、注意事项:
1)switch()中的表达式,以及每个case后面的表达式,可以为任何JS支持的 数据类型;(对象和数组不同);
2)case后面的所有常量表达式,必须各不相同,否则只会执行第一个;
3)case后的常量可以是任何数据类型;同一个switch结构的不同case,可以是多种不同的数据类型;
4)switch在进行判断时,采用的是全等判断===
5)break的作用:执行完case代码后,跳出当前switch结构;
缺少break的后果:从正确的case项开始,依次执行所有的case和defalse
6)switch结构在判断时,只会判断一次正确答案,当遇到正确的case项后,将会不再判断后续项目,依次往下执行;
7)switch结构的执行速率要快于多重if结构。在多路分支时,优先考虑switch结构。

【循环结构的步骤】
1)声明循环变量
2)判断循环条件
3)执行循环体(while的{}中所有代码)操作
4)更新循环变量
然后,循环执行2)3)4)

【JS中循环条件支持的数据类型】
1)Boolean:true 真 ; false 假
2)string:非空字符串为真 ;空字符串为假
3)Number:0为假 ;一切非0均为真
4)Null/NaN/Undefined:全为假
5)Object:全为真

while循环特点:先判断,在执行
do-while循环特点:先执行,在判断;即使初始条件不成立,do-while循环也至少执行一次

【For循环】
1、for循环有三个表达式,分别为:①定义循环变量 ② 判断循环条件 ③更新循环变量(三个表达式之间,用;分隔。)
for循环三个表达式可以省略,两个;缺一不可
2、for循环特点:先判断,再执行;
3、for循环三个表达式,均可以有多部分组成,之间用逗号分隔,但是第二部分判断条件
需要用&&链接,最终结果需要为真/假

时间: 2024-07-31 14:34:44

【JavaScript基础】------有待完善的相关文章

【javascript基础】7、继承

原文:[javascript基础]7.继承 前言 由于本人水平有限,所以有些高手觉得现在写的内容偏容易,要一点点来嘛,今天和大家学习或者复习一下javascript的继承.我也就是尽量写吧······ 继承 javascript的继承其实主要就是通过原型链来实现的,原型链我们之前已经和大家一起学习过,这里就不浪费大家的时间了.javascript连类都没有,还说啥继承呢,这还是模拟类的继承.<javascript高级程序设计>上分成了几个方式,有的书上分为类式继承,原型式继承,这就是模拟其他语

javascript基础修炼(7)——Promise,异步,可靠性

开发者的javascript造诣取决于对[动态]和[异步]这两个词的理解水平. 一. 别人是开发者,你也是 Promise技术是[javascript异步编程]这个话题中非常重要的,它一度让我感到熟悉又陌生,我熟悉其所有的API并能够在编程中相对熟练地运用,却对其中原理和软件设计思想感到陌生,即便我读了很多源码分析和教程也一度很难理解为什么Promise这样一个普通的类能够实现异步,也曾尝试着去按照Promise/A+规范来编写Promise,但很快便陷入了一种更大的混乱之中.直到我接触到一些软

javascript入门书籍推荐《javascript基础教程》

前段时间看javascript高级教程的时候,发现很多基础的javascript概念,自己不懂. 网上搜了一下,看到大家对<javascript基础教程(第8版)>评价不错,买了一本. 作者: (美)Tom Negrino Dori Smith 译者: 陈剑瓯 柳靖 丛书名: 图灵程序设计丛书 出版社:人民邮电出版社 翻开看了后,受益匪浅,决定将这本书推荐给javascript的入门童鞋. 这本书的读者,要有一定的HTML基础,因为javascript基本都是对Dom的操作,所以,有一定的HT

js基础--javascript基础概念之语法

掌握一门语言 必须先掌握它的语法! javascript 的语法和C.Java.Perl 的语法有些相似.但是比它们更加宽松. javascript 中的一切都是严格区分大小写的.例如变量: demo 和 Demo 两个变量是完全不同的. javascript 标示符,所谓标示符 是指 变量.函数.属性 的名字或函数的参数.标示符的格式是按照以下规则组合的一个或多个字符. 1.第一个字符必须是字母,下划线,或 $ 符号. 2.其他字符可以是字母.下划线.$ . 或数字. 注意 不能把关键字 保留

Javascript.01 -- Javascript基础

Javascript基础 1 聊聊Javascript 1.1 Javascript的历史来源 94年网景公司   研发出世界上第一款浏览器. 95年 sun公司   java语言诞生 网景公司和sun合作. Java+script   ===> javascript 1.2 W3c规范 ?结构标准        html ?表现标准   css ?行为标准      js 1.3 JavaScript和ECMAScript的关系 ECMAScript是一种由Ecma国际前身为欧洲计算机制造商协

javascript基础学习(十五)

javascript之cookie 学习要点: cookie介绍 创建与获取cookie cookie的编码 cookie的生存期 cookie的路径 cookie的domain cookie的secure 一.cookie介绍 cookie实际上就是一些信息,这些信息以文件的形式存储在客户端计算机上.在javascript中,cookie主要用来保存状态,或用于识别身份. 二.创建与获取cookie 创建cookie的语法代码如下所示:document.cookie="name=value&q

javascript基础学习(八)

javascript之日期对象 学习要点: 日期对象 将日期对象转换为字符串 将日期对象中的日期和时间转换为字符串 日期对象中的日期 日期对象中的时间 设置日期对象中的日期 设置日期对象中的时间 与毫秒相关的方法 一.日期对象 在javascript中并没有日期型的数据类型,但是提供了一个日期对象可以操作日期和时间. 日期对象的创建: new Date(); 二.将日期对象转换为字符串 将日期对象转换为字符串可以使用以下4种方法: date.toString();//将日期对象转换为字符串时,采

javascript基础学习(二)

javascript的数据类型 学习要点: typeof操作符 五种简单数据类型:Undefined.String.Number.Null.Boolean 引用数据类型:数组和对象 一.typeof操作符 typeof操作符用来检测变量的数据类型,操作符可以操作变量也可以操作字面量. 对变量或值运用typeof操作符得到如下值: undefined----如果变量是Undefined类型: boolean-------如果变量是Boolean类型: number-------如果变量是Numbe

javascript基础语法——词法结构

× 目录 [1]java [2]定义 [3]大小写[4]保留字[5]注释[6]空白[7]分号 前面的话 javascript是一门简单的语言,也是一门复杂的语言.说它简单,是因为学会使用它只需片刻功夫:而说它复杂,是因为要真正掌握它则需要数年时间.实际上,前端工程师很大程度上就是指javascript工程师.前端入门容易精通难,说的是前端,更指的是javascript.本文是javascript基础语法的第一篇——词法结构 与java关系 关于javascript有这样一个说法,java和jav