Javascript笔记资料Word格式.docx
- 文档编号:676847
- 上传时间:2023-04-29
- 格式:DOCX
- 页数:94
- 大小:59.12KB
Javascript笔记资料Word格式.docx
《Javascript笔记资料Word格式.docx》由会员分享,可在线阅读,更多相关《Javascript笔记资料Word格式.docx(94页珍藏版)》请在冰点文库上搜索。
Shift+Enter
2.独立安装的js引擎:
node.jsV8
让js运行在任何平台。
网页中如何编写js:
3种方式:
1.网页中的<
script>
元素中:
<
专门保存js程序的元素
可以写在网页的任何位置,随网页解释执行
脚本:
不用编译,直接边解释边执行的程序
2.元素的事件属性中:
事件:
用户或浏览器自身触发的动作
事件触发后,才会执行事件处理程序
元素on事件名="
事件处理程序(js语句)"
...
ponclick="
window.alert('
Helloonclick'
)"
当单击的时候,请window窗口,弹出警告
3.单独的.js文件中集中编写:
执行过程和在<
中编写的脚本完全一样!
2步:
1.新建.js文件,包含js程序
2.在页面顶端,引入外部js文件:
scriptsrc="
路径"
>
<
/script>
如何调试js程序:
1.js中错误:
只要希望的功能没执行,说明功能出错了
***只要出错先开F12(控制台)***
控制台中包含:
错误类型:
错误原因错误位置链接
错误现象:
出错位置之前的代码——正常执行
同一script中出错位置之后的代码——不执行
一个script出错,不影响其他位置script的执行
程序错误:
bug处理解决错误:
debug
1.***变量
2.***数据类型
1.变量:
什么是变量:
内存中一块存储一个数据的空间再起一个名字。
何时使用变量:
程序中的一切数据都要保存在变量中,反复使用
如何使用变量:
2种情况
1.赋值:
2步:
1.创建变量:
——声明——创建一个新的空变量
语法:
var变量名;
仅声明,未赋值的变量,默认值是undefined
变量命名:
见名知义
1.*不能以数字开头
2.*不能用保留字:
被js已经占用,有特殊意义的词
3.如果又多个单词组成,一般采用驼峰命名:
第一个单词首字母小写,其余单词首字母大写
2.赋值:
将数据保存到变量中
变量名=数据;
其中:
=就是赋值的意思。
将等号右边的"
数据"
,放到等号左边的变量中保存
强烈建议:
在声明同时就赋值
var变量名=数据;
程序中的赋值,都是*替换*变量中原有旧值
2.取值:
使用变量名,等效于直接使用变量中保存的数据
特殊情况:
1.*给未声明过的变量赋值不会出错,程序会在window范围内自动创建同名变量,再赋值。
*:
强烈建议,所有变量用var声明
如果不带var,js会自动在之前加:
window.
变量的本质:
都是window环境下的存储空间
vara==>
window.a==>
a
2.*从未声明过的变量中取值一定会出错*:
ReferenceError
3.变量之间赋值:
形如:
变量1=变量2;
执行时:
将变量2中的数据复制一个副本放入变量1中。
变量2中原数据保持不变。
此后,变量1和变量2之间,不再有任何联系!
4.***声明提前:
在正式执行js脚本之前,js引擎会提前阅读程序中的所有var。
将所有变量集中到程序开始位置声明!
***赋值,仍留在原地!
***
比如:
console.log(m);
//不会出错!
输出undefined
varm=100;
console.log(m);
//输出100
建议:
在程序开始位置集中声明变量
常量:
一旦创建,值不可改变的量
何时使用常量?
一旦创建,值不希望被篡改时,就要保存为常量
语法:
const常量名=值;
如何使用常量?
用法和变量完全一样!
除了不能赋值!
2.***数据类型:
数据在内存中的存储格式
为什么要有不同数据类型:
不同数据的类型,可执行的操作不同
js中数据类型:
2大类:
1.原始类型:
数据直接保存在变量本地的数据类型!
5种:
String,Number,Boolean,undefined,null
2.引用类型:
数据不保存在变量本地的数据类型!
(待续)
1.Number类型:
js中专门保存数字的类型,不带引号!
何时使用:
用于计算或比较大小时,都用Number类型
其实数字分两种情况:
整数,浮点数(小数)
整数:
4字节(byte)32位
浮点数:
8字节(byte)64位
8Bit=1byte1KB=1024byte1MB=1024KB...
8位=1字节
Number类型所占空间和数值大小没有直接关系。
varn=1;
n占4字节
varm=100000000;
m也占4字节
***舍入误差:
因为计算机无法精确表示1/10,造成的计算误差
不可避免!
近似解决:
n.toFixed
(2):
将n按2位小数四舍五入!
2.String类型:
专门保存一串文字的数据类型
字符串必须用引号包裹!
用于输出或显示的文字都要加双引号
1.所占空间:
js采用Unicode字符集编码
unicode:
对全球主要文字的每个字符编一个号
js中每个字母,数字,英文标点占1字节
js中每个汉字占2字节!
“Hello马里奥”
1*5+2*3=11个字节
2.*字符串内容一旦创建不可改变*!
两个字符串可使用+拼接为1个字符串
varstr1="
Hello"
;
str1=str1+"
World"
console.log(str1);
//共创建3个字符串
3.Boolean:
专门定义真假的类型:
truefalse
何时使用boolean?
如果数据只有两种情况时,可用boolean类型
varisRain=false
varisMan=true
varisClassOver=true
JavaScript权威指南(犀牛书)
微信公众号:
前端大全
回顾:
声明(var)赋值(=)
取值(使用变量名等效于直接使用变量中的数据)
***变量声明提前:
仅var被预读到开始位置,赋值留在原地
//?
undefined
Varm=100;
100
***使用变量报错:
从未声明的变量中取值:
varn;
console.log(n);
//报错:
misnotdefined
***省略var:
程序会自动加window.前缀
2.数据类型:
2大类
数据直接保存在变量本地
Number(舍入误差)
String(每个字母/数字/标点1字节
每个汉字2字节
***内容一旦创建不可改变)
varstr1="
world"
//创建过3个
Boolean(truefalse)
数据不保存在变量本地
1.***数据类型转换
2.***运算符和表达式
1.数据类型转换:
***js是弱类型编程语言
1.声明变量时,不必提前规定变量的数据类型
2.赋值时,根据存入数据,动态决定数据类型
3.运算时,js会根据需要,动态转换数据的类型
2大类:
1.隐式转换:
不需要程序员干预,js会根据需要自动转换类型
仅讨论+运算中的隐式转换*规律*:
没有字符串参与:
所有类型都转为Number类型
做算术计算!
Boolean:
true->
1false->
有字符串参与:
所有类型都转为String类型
做字符串拼接
多个数据+运算:
从左向右,两两计算
注意:
隐式转换发生在运算过程中,
不改变变量中的实际存储。
2.强制转换:
程序员通过调用专门函数,明确的转换数据类型
1.任意类型-->
String:
2种:
varstr=x.toString();
varstr=String(x);
//相当于隐式转换
补:
typeof(x):
返回x的数据类型名称
不需要自己调用,程序根据需要会自动调用
2.***任意类型-->
Number:
2种
varn=Number(x);
将*任意类型*数据,转为Number类型
varn=parseInt(str);
专用于将*String*类型转为Number类型
本质:
从左向右依次读取str中的整数部分!
返回值:
整数
碰到第一个不是数字的字符,停止读取!
特点:
1.不认识小数点!
2.跳过空格!
varstr="
12px"
$12"
12.56"
12NaN12
varn=parseInt(str);
//12
***如果无法转为数字,则返回NaN
什么是NaN:
NotaNumber:
不是数字的数字
parseFloat(str);
用法和parseInt完全相同!
差别:
parseFloat认识*第一个*小数点
浮点数
12.5px"
12.0px"
12.5.5"
12.51212.5
varf=parseFloat(str);
//12.5
总结:
将非字符串类型转数字:
Number(x)
将字符串转数字:
parseInt(str)
3.任意类型-->
Boolean:
varbool=Boolean(x);
//相当于隐式转换
课堂练习:
输入框:
varinput=[window.]prompt("
输入提示"
***凡是从页面上获得的任何数据,都是字符串类型
2.***运算符:
程序中模拟人思维运算的特殊符号
什么是表达式:
由运算符,变量,数据组成的一条语句;
8种:
1.算术运算:
+-*/%++--
算术运算中,一切数据默认都转为Number计算
算术运算的结果,只可能是数字
如无法转为数字,则转为NaN
NaN和任何数据做计算,结果还是NaN。
%模运算(取余数):
被除数/除数,取除不尽的余数部分
6789%100=89;
6789/100,取除不尽的余数部分
17%3=2;
1.判断能否整除,判断奇数偶数:
n%2等于0偶数n%2等于1奇数
2.余数不可能>
被除数,通常用模运算限制一个运算的结果不能超过某数
1.++--
2.关系运算:
专门做比较和判断的运算符
3.位运算:
4.赋值运算:
5.三目运算
1.++--:
++:
前++:
将变量本身的值+1,返回*新值*
varn=10;
//旧值console.log(++n);
//返回新值11
后++:
将变量本身的值+1,返回*旧值*
//旧值console.log(n++);
//返回旧值10
--:
用法和++完全一样:
n--==>
n=n-1
单用:
两者无差别!
++用于其他表达式中时:
前++返回新值,
后++返回旧值
做比较,做判断。
所有关系运算都返回Boolean值
>
=<
===!
=
关系运算中,所有数据默认转为数字类型比较
如果无法转为数字,则转为NaN,
但NaN和任意数据做比较,永远不相等!
特殊情况:
两字符串做比较:
依次PK两字符串中每个字符的unicode码
只要任意一位字符比较出结果就不再继续向后比较
varname1="
Eric"
varname2="
Scott"
E"
69<
S"
83
name1>
name2false
varname3="
Smith"
83="
c"
99<
m"
109
name2>
name3false
NaN:
和任何元素做>
==比较都返回false
和任何元素做!
=比较都返回true
问题:
无法用==或!
=判断一个数据是否是NaN
解决:
isNaN(x):
专门用于判断任意数据是否是NaN
*专门用于判断任意数据是否是数字或可被隐式转为数字
如果x是数字或可以被隐式转为数字,则返回false
如果x不是数字或不可被隐式转为数字,则返回true
undefinedvsnull:
程序中二者本应完全相同,但用途不同
undefined自动初始化变量
null主动清空变量
undefined==null==>
true
自动转为null
===:
严格相等/全等:
不带隐式转换!
要求参与比较的数据,类型必须相等
undefined===null==>
false
undefinedObject
今后只要判断null或undefined,都要用===
只要不希望比较时自动类型转换,就用===
3.逻辑运算:
利用多组关系运算,综合判断得出结论
返回值还是Boolean值
3种:
&
:
而且"
所有条件都为true,结果才能为true
只要有一个条件为false,结果只能为false
||:
或"
只要有一个条件为true,结果就能为true
所有条件都为false,结果才为false
!
颠倒一切Boolean结果
***短路逻辑:
前一个条件已经能够得出结果
后续条件不再执行!
/*查看day02素材-->
operators.jpg:
js运算符优先级
优先级高的,先运算!
圆括号可改变优先级顺序*/
4.位运算:
左移:
n<
mn*2的m次方
右移:
n>
mn/2的m次方
3<
43*(2*2*2*2)=48
64>
364/(2*2*2)=8
5.赋值运算:
=将等号右边的值保存到等号左边的变量中
扩展赋值运算:
+=-=*=/=%=
n=n+1;
n++;
仅能递增1
n=n+2;
n+=2;
累加2;
或递增2直接修改原变量中的值
n+=3;
累加3;
或递增3
只要做累加时,都要用扩展赋值运算。
-=,*=,/=,%=用法同+=
n-=2;
==>
n=n-2;
n*=2;
n=n*2;
n/=2;
n=n/2;
n%=2;
n=n%2;
6.三目运算:
根据不同的条件,多选一,返回不同的结果
只要根据不同条件返回不同结果时
条件?
满足条件返回的值:
不满足条件返回的值
返回值:
只能返回两个值之一!
***根据多个条件,多选一!
条件1?
满足条件1返回的值:
条件2?
满足条件2返回的值:
...
默认值;
体重健康指数(克莱托指数)计算公式如下:
可莱托指数=体重(kg)÷
身高2(m)
20-25正常,
20以下瘦,
25以上胖。
例如:
某人是60kg,1.7m,那就是:
60÷
1.72=20.76,属于“正常”体重;
编写一个函数,接收体重和身高作参数,返回判定结
果。
请用户输入体重和身高
根据体重和身高计算可莱托指数
根据可莱托指数的范围输出胖瘦情况
如果指数>
25,输出胖
如果指数<
20,输出瘦
否则输出正常
1.***函数
2.全局函数——了解
3.*分支结构
1.函数:
封装一项专门任务步骤清单的代码段
起一个任务名
为什么使用函数:
重用!
只要发现一项任务,反复编写时,都要封装为函数
如何定义函数:
1.声明:
function任务名([参数变量列表]){
任务的步骤清单;
[返回结果;
]
}
2.调用:
任务名([参数值列表]);
参数:
专门接收传入函数内部的数据的*变量*
何时使用参数:
当函数必须接收某些数据才能正常执行时
如何声明参数变量:
声明函数时,在函数名后的圆括号中
不用var
每个参数变量之间用逗号分隔
参数变量的用法:
和普通变量完全一样!
何时/如何传入参数值:
调用时,在函数名后的圆括号中
参数值的个数和顺序要和参数变量声明时保持一致
参数使函数变得更灵活!
函数调用后,返回的执行结果!
——1个数据
如何返回:
声明函数的内部:
return返回值;
return退出函数执行并返回结果。
return仅负责返回数据,不负责保存数据!
如何保存函数的返回值:
调用时:
变量=函数名(...);
***变量作用域:
一个变量可用的范围:
1.全局作用域:
全局window下的,任何位置都可访问
全局变量:
保存在全局作用域下的变量
优势:
共享
劣势:
共享的资源,牵一发动全身,易被“污染”
2.函数作用域:
仅在函数内可用
局部变量:
仅在函数内可用的变量
1.声明在函数内的变量
2.***参数变量也是局部变量!
独有,安全
不可重用
函数作用域及局部变量:
随每次函数调用时,临时创建。
函数调用完,立刻释放。
下次再调用函数,再重新创建。
函数定义始终存在,不会释放!
***作用域:
全局变量
局部变量:
在函数内var;
参数变量
声明函数:
创建了函数的定义,没有执行任何函数体!
调用函数时:
创建函数作用域,并在函数作用域中创建局部变量
函数调用后:
函数作用域释放!
局部变量不复存在!
1.***函数:
***声明提前***按值传递
3.*分支结构:
***声明提前:
js程序正式执行前,引擎会预读var和function到*当前作用域*的顶部。
赋值留在原地
面试技巧:
凡是遇到声明提前的问题,都先预读,再执行。
***按值传递:
在向函数中传入参数时,
外部变量仅将值*复制一个副本*,给函数的参数变量
函数内修改参数变量,不影响函数外原变量的值
——最后一句,仅适合原始类型
2.全局函数:
不用加任何前缀(对象),就可直接调用的函数
parseInt/Float(str)
isNaN(x)
isFinite(x):
是有效范围内的数字
专门用于判断一个数字是否为Infinity(无穷大)
isFinite(n/0);
//false
isFinite(n/5);
//true
isFinite(NaN);
eval(str):
专门执行字符串格式的js表达式,返回执行结果
%E5%BC%A0%E4%B8%9C
张东
utf-8编码
问题1:
url中不允许包含多字节字符
用专门的函数,将多字节字符,编码成单字节
如何编码:
encodeURI(str)
对方解码:
从单字节,转换回多字节字符:
decodeURI(str)
问题2:
url中不允许包含url保留符号,比如:
:
/等
http:
//==>
编码为http%3A%2F%2F
编码encodeURIComponent(str)
解码decodeURIComponent(str)
encodeURIComponent同时包含encodeURI的功能
根据不同的条件,选择*执行*不同的*代码段*!
vs三目:
根据不同的条件,*返回*不同的*值*
程序结构:
3种:
1.顺序结构:
默认自上向下顺序执行(函数除外)
2.分支结构:
根据不同的条件,执行不同的任务
3.循环结构:
程序反复执行同一段代码。
分支结构:
1.if结构:
1件事,满足条件就做,不满足就不做
if(条件){
满足条件才执行的代码
简写:
条件&
满足条件才执行的代码
仅限于执行的代码只有一句时,才可用
2.if...else结构:
2件事,必须二选一执行
满足条件才执行的代码
}else{//读作"
否则"
不满足条件时执行的代码
3.elseif结构:
多个条件,多件事,必须多选一执行
if(条件1){
满足条件1才执行的代码
}elseif(条件2){
满足条件2才执行的代码
}elseif(条件3){
......
}......
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- Javascript 笔记 资料
![提示](https://static.bingdoc.com/images/bang_tan.gif)