前端开发JS——快速入门
程序员文章站
2022-04-15 08:56:18
1、JS的核心标准ECMAScript 组成 ECMAScript >核心语法标准 DOM >对文档节点的操作 BOM >对浏览器的操作 2、JS的注释: 单行注释 //注释内容 多行注释 /* 注释内容 */ 3、JS的保留字和关键字 关键字:有特殊功能的单词如: break do try typ ......
1、js的核心标准ecmascript
组成
ecmascript------>核心语法标准
dom------------->对文档节点的操作
bom------------->对浏览器的操作
2、js的注释:
单行注释
//注释内容
多行注释
/*
注释内容
*/
3、js的保留字和关键字
关键字:有特殊功能的单词如:
break
|
do
|
try
|
typeof
|
case
|
else
|
new
|
var
|
catch
|
finally
|
return
|
void
|
continue
|
for
|
switch
|
while
|
debugger
|
this
|
function
|
with
|
default
|
if
|
throw
|
instanceof
|
delete
|
in
|
|
|
|
|
保留字:将来有可能成为关键字的单词如:
abstract
|
enum
|
int
|
short
|
boolean
|
export
|
interface
|
static
|
byte
|
extends
|
long
|
super
|
char
|
final
|
native
|
synchronized
|
class
|
float
|
package
|
throws
|
const
|
goto
|
private
|
transient
|
debugger
|
double
|
implements
|
protected
|
volatile
|
import
|
public
|
|
|
|
|
|
4、js的变量
声明:用var声明变量(变量都是弱类型的)
var a;
var a = 12;
var a=1, b=2, c=3;
变量命名规则:
1、字母、数字、下划线、$组成
2、数字、下划线不能开头(下划线可以开头,尽量不要使用)
3、尽量采用驼峰式命名法
4、不能使用关键字和保留字
注意:尽量写完一段语句,在其后面添加分号“ ; "
5、数据类型:
检查数据类型的关键字:typeof 例如:console.log(typeof a); //检查变量a的类型
基本数据类型5种
undefined类型 只有一个值就是undefined值,undefined继承null
1)声明但没有初始化的变量
var a;//a的值是undefined
2)显示将undefined值赋值给一个变量
var a =undefined;
基本数据类型5种
undefined类型 只有一个值就是undefined值,undefined继承null
1)声明但没有初始化的变量
var a;//a的值是undefined
2)显示将undefined值赋值给一个变量
var a =undefined;
null类型 空,一般用来存放一个空对象的指针,就只有一个值null null==undefined; //true
var a = null;
boolean类型
有两个值:true、false
var a = true;
var a = false;
number类型
var a = 12;
number类型还有一个值nan,nan不能用双等去判断,因为任何值与nan都不会相等,console.log(typeof 1/"str"); //nan
判断一个值是不是nan用isnan(变量名或者值)方法判断,他判断的是不是 不是一个数值
number类型还有两个值:infinity和-infinity值,判断数值是否在数值类型范围内:isfinite()
number类型还有两个值:infinity和-infinity值,判断数值是否在数值类型范围内:isfinite()
string类型(javascript中没有字符类型的概念)
var a = "true";
var a = 'false';
//打印字符串的长度
console.log(a.length); //5
注:和上面boolean的值和类型都是不相等的
引用类型3种
object类型 对象
var a = {};
var a = {'name': 'zhangsan'};
object类型 对象
var a = {};
var a = {'name': 'zhangsan'};
console.log(a["name"])
注:上述的name属性可以不打引号;类似于python的字典,任意数据都能存储,访问方式也类似于python
array类型 数组 打印的时候会是一个object对象类型
var arr = [1,2,3,4,5];
注:类似于python的列表,任意数据都能存储
function类型 函数
function test(){}
注:上述的name属性可以不打引号;类似于python的字典,任意数据都能存储,访问方式也类似于python
array类型 数组 打印的时候会是一个object对象类型
var arr = [1,2,3,4,5];
注:类似于python的列表,任意数据都能存储
function类型 函数
function test(){}
var test = function(){}
如果函数();在函数定义之前,浏览器会自动将函数提升到执行函数的前面
注:使用没有声明过的变量,编辑器会报错;如果在之后声明或者赋值只会打印undefined值,就不会报错如:
1)console.log(c); //这里就会报错;
2)console.log(c); //这里就不会报错,并且打印undefined
var c;
3)console.log(c); //这里就会先打印undefined值
var c = 1;
console.log(c); //之后再打印1值
在js中变量声明会提升
6、运算符:
==就是判断值是否相等
===就是判断“值是否相等”和“类型是否相等”
7、js特点
1)浏览器端执行,node环境执行
2)解释性语言
3)弱类型语言
4)自上而下执行
8、运算符
1)操作运算符 +、-、*、/、%,和java、python等高级语言的使用相同
2)一元运算符 ++、--,也是和java语言的使用相同,包含前自增/减(先做运算再使用)、后自增/减(先使用再做运算)
+/-,可以将其他类型转换成number类型
+/-,可以将其他类型转换成number类型
console.log(+'123'); //输出123 -'123'输出-123, -'-123'输出123
console.log(+true); //输出1
console.log(+false); //输出0
console.log(+null); //输出0 -null输出-0
console.log(+undefined); //输出nan
console.log(+''); //输出0
console.log(+' '); //输出0
3)赋值运算符 =、+=、-=、*=、/=、%=
var a = 2;
var a += 2; //a=a+2
var a -= 2; //a=a-2
var a *= 2; //a=a*2
var a /= 2; //a=a/2
var a %= 2; //a=a%2
4)比较运算符
1 == ‘1’ //true
true == ‘true’ //false
1 == true //true
0 == null //false
注:只有null和null相等的,undefined和undefined相等的 undefined == null值为true,这三者才为true
总结:number和string看起来一样就为true;
boolean转换为number一样,就为true;(true -> 1,false -> 0)
如果进行运算boolean类型根据上述转换,再和number值运算
string和boolean,即使看起来一样,也为false;
5)逻辑运算符 (表示false的值有null、nan、undefined、false、0、“”)
var a = 2;
var a += 2; //a=a+2
var a -= 2; //a=a-2
var a *= 2; //a=a*2
var a /= 2; //a=a/2
var a %= 2; //a=a%2
4)比较运算符
1 == ‘1’ //true
true == ‘true’ //false
1 == true //true
0 == null //false
注:只有null和null相等的,undefined和undefined相等的 undefined == null值为true,这三者才为true
总结:number和string看起来一样就为true;
boolean转换为number一样,就为true;(true -> 1,false -> 0)
如果进行运算boolean类型根据上述转换,再和number值运算
string和boolean,即使看起来一样,也为false;
5)逻辑运算符 (表示false的值有null、nan、undefined、false、0、“”)
总结:逻辑与和逻辑或的返回值都是跳出判断的值,即哪个操作跳出来就返回哪个操作数
非!(not) 可以将任何类型的数据转换成boolean类型
!!a可以看成boolean(a), boolean类型包装器
6)三目运算符 (variable = boolean_expression ? true_value : false_value;)
可以简化if···else···语句
7)两者运算 m+n
1、当m,n不为string,object类型的时候,先将m,n转换为number类型,转换number类型可以参考类型转换知识点,然后再进行计算
2、当m,n有一个为string,无论另一个操作数为何(但不为对象)都要转换为string,然后再进行拼接
3、当m,n 有一个为对象,如果该对象既重写tostring,又重写了valueof方法,先调用valueof方法获 取返回值,将该返回值和另外一个操作数进行运算。如果该对象没有重写valueof方法,将调用 tostring方法获取返回值,将该返回值和另外一个操作数进行运算。
//对象相加 var obj = { "name": "zhangsan", "age": 20, tostring: function(){ return "this is a obj" }, valueof: function(){ return "this is a func" } } var c = "str" console.log(obj); console.log(c+obj); //strthis is a func alert(obj); //this is a obj
9、类型转换
假性值:表示false的值有null、nan、undefined、false、0、“”,这个尤为重要
1)其他类型转换string类型:
①tostring()函数 另外null、undefined不能转换,其他类型都能
var a = 12;
a.tostring(); //'12',如果括号里有数字,就需要按照这个数字的进制来转换,例如 a.tostring(8); //"14"
注:number类型的具体值不可以直接调用tostring()方法,但可以用括号括起来使用,括号括起来的是大类型数据,基础数据类型没有属性和方法
②string()函数 任意类型都能转换
③字符串的拼接+
2)其他类型转换boolean类型
①boolean()函数 任意类型都可转换
假性值都为false,其他的值都为true
②非!(not) 可以将任何类型的数据转换成boolean类型
!!a可以看成boolean(a),boolean类型包装器
3)其他类型转换number类型
①number()函数(不解析八进制,可以解析十六进制)转换规则如下:
1)其他类型转换string类型:
①tostring()函数 另外null、undefined不能转换,其他类型都能
var a = 12;
a.tostring(); //'12',如果括号里有数字,就需要按照这个数字的进制来转换,例如 a.tostring(8); //"14"
注:number类型的具体值不可以直接调用tostring()方法,但可以用括号括起来使用,括号括起来的是大类型数据,基础数据类型没有属性和方法
②string()函数 任意类型都能转换
③字符串的拼接+
2)其他类型转换boolean类型
①boolean()函数 任意类型都可转换
假性值都为false,其他的值都为true
②非!(not) 可以将任何类型的数据转换成boolean类型
!!a可以看成boolean(a),boolean类型包装器
3)其他类型转换number类型
①number()函数(不解析八进制,可以解析十六进制)转换规则如下:
假性值当中只有undefined是转换nan,其他的都转换0
字符串的字面值为数字的,就直接转换,或者其前面有加号”+“,都可以直接转换
其他的都转换nan
②parseint()函数(不解析八进制,可以解析十六进制) //如果有两个参数,第一个参数是第二个参数进制的表示,例如 console.log(parseint("1010", 2)); //10
②parseint()函数(不解析八进制,可以解析十六进制) //如果有两个参数,第一个参数是第二个参数进制的表示,例如 console.log(parseint("1010", 2)); //10
如果第一个字符不是数字或者负号,parseint() 就会返回nan,同样的,用parseint() 转换空字符串也会返回nan。
如果首位为数值,依次向后解析,找到连续的数值,直到遇到第一个非数值的,将之前获取的数值转换为number返回
③parsefloat()函数(不解析八进制,也不解析十六进制)
如果首位为数值,依次向后解析,找到连续的数值,直到遇到第一个非数值的,将之前获取的数值转换为number返回
注:parsefloat() 所解析的字符串中第一个小数点是有效的,而parseint() 遇到小数点会停止解析,因为小数点并不是有效的数字字符。
parseint和parsefloat都将null、undefined、boolean解析为nan
注:console.log()会返回一个值里面包含的所有空格,但是返回到页面上就不会解析连续的空格
如果首位为数值,依次向后解析,找到连续的数值,直到遇到第一个非数值的,将之前获取的数值转换为number返回
注:parsefloat() 所解析的字符串中第一个小数点是有效的,而parseint() 遇到小数点会停止解析,因为小数点并不是有效的数字字符。
parseint和parsefloat都将null、undefined、boolean解析为nan
注:console.log()会返回一个值里面包含的所有空格,但是返回到页面上就不会解析连续的空格
4)+ 自动类型转换