JavaScript基本语法(一)

目录

1. 语句

2. 变量

3. 小结


JavaScript基本语法(一)是JavaScript核心知识点(ECMAScript)的基本语法的第一部分,主要介绍了:JavaScript语句、表达式、变量和数据类型(不包括函数类型)的基本知识点,函数类型将在下一章《JavaScript函数(二)》中详细探讨;


1.语句

JavaScript程序的执行是由一条条语句组成的;

  • 每一条语句是为完成特定任务而执行的操作;
  • 语句当中可以包含处理数据的表达式,表达式指可得到返回值的计算式;
  • 语句结束的标志是;
var a = 1;
//执行赋值操作的语句,结束标志的分号
var b = 1+1;
//执行赋值操作的语句,赋值操作符右边使用了表达式,返回值为2,结束标志是分号

2. 变量

JavaScript是一门弱类型语言,通过使用关键字var声明变量,在赋值时变量的数据类型将根据值的类型动态转变,从而体现弱类型的特征。

2.1 变量的声明与赋值
  • 声明变量但为赋值
    变量只声明不赋值,则变量被赋一个特殊的值undefined
var a;
a//undefined
  • 声明变量并赋值
    变量既声明又赋值,则产生变量提升,即js引擎在解析阶段会将所有的声明变量提升到当前作用域的头部;
var a = 1;
//等价于
var a;
a  = 1;
  • 一次性声明多个变量
var a=1,
    b=2,
    c=3;
2.2 标识符(identifier)

标识符即标识变量的名字,例如var a =1,标识符为a,标识符的命名规则如下:

  • 第一个字符必须是任意Unicode字母、下划线_或是美元符号$;
  • 其他字符除了运算符外,基本都可以使用;
  • 变量名通常采用camelCase;
  • ECMA-262规定的关键字和保留字不能用作标识符;
2.3 数据类型

JavaScript的数据类型主要包括数值、字符串、布尔值、对象、undefinednull,ES6新增Symbol

其中,数值、字符串和布尔值可称为基本数据类型,因为所有的数据都是由这三种最基本的类型的值构成;

对象可称为复杂数据类型,这里的对象指的是广义的对象,具体可细分为:

  • 狭义的对象(object)
  • 数组(array)

  • 函数(function)
    狭义的对象和数组本质上是基本类型数据的集合,对象是一组无序键值对的集合,数组则是一组有序键值对(键名为从0开始的数字)的集合;
    函数在JavaScript当中既是处理数据的方法,更是一种数据类型,既可赋值也能传参;

  • 数值型
    Number类型所有数字以64位浮点数形式存储(相当于双精度数值);
    各种进制的数字的字面量表示

var a = 12//十进制,12
var b = 0B1//二进制,2
var c = 010 //八进制,8
var d = 0x10 // 十六进制,16
var e = 1.503e7 //科学计数法,15030000

【TIP】
在进行进制间的算术计算时,最终将转换为十进制;
八进制在严格模式下是无效的,会报错;
数值的范围
js能表示的数值的最大、最小范围保存在Number.MAX_VALUENumber.MIN_VALUE当中;
无穷大的数值存储在Number.POSITIVE_INFINITY,无穷小的数值Number.NEGEITIVE_INFINITY,可用isFinite()函数检测一个数值是否是无穷数值;


NaN
NaN是一个特殊的数值,表示非数字,主要出现在本来要返回数值的操作数未返回数值的情况下最终抛出一个NaN替代,主要出现场景如下:

//在进行算术运算时,无法将该变量进行数据类型转换为数值;
var a =1,b= "h"
a-b
//不符合算是运算法则
0/0


【TIP】
使用typeof NaN会抛出"number",证明NaN是一个特殊的数值;
NaN === NaN结果是false,证明,NaN不等于任何值;
可使用isNaN()判断一个值是否为NaN
数值类型转换
js提供三个方法将数据转换为数值类型,包括Number()parseInt()parseFloat();
Number()可将所有类型数据转换为数值,parseInt()parseFloat()能将字符串转换为数值;

Number()除了值为undefined、字符串和对象无法转换为数值的将转换为NaN,其他都可转换为数值;

此外,还可以使用算术操作符实现数值类型转换,作用相同于Number():


<pre>
在进行字符串转换为数值时,通常使用parseInt(),该方法的处理原理是忽略字符串前的空格,直到找到第一个非空格字符,
如果第一个字符不是数字字符或负号,则返回NaN,也就是说parseInt('')和parseInt(null)与Number()的返回值不同;
</pre>

<pre>
可为parseInt()提供第二个参数,指明要进行转换的数值的进制
</pre>

<pre>
parseFloat()方法的处理原理基本和parseInt()类似,区别在遇到第一个小数点是有效的,第二小数点是无效的,并且直解析十进制;
</pre>


  • 字符串型
    字符串可以看做是放置在''""内的零个或多个字符的数据;
    字符串的多种处理方式
//可用单引号也可用双引号;
var a = "H",
      b = 'E';
//长字符串的表示,多适用于HTML模板的表示
var c = "
            <template> \
                     <h1>JavaScript</h1> \
                    <p>Hello World!</p> \
            </template>
"
//多个字符串的拼接,多适用于添加js代码
var c = "hello"+"world"+document.getElementById('demo').innerHTML

转移字符
string数据类型包含一些特殊的字符,用于表示非打印字符或是具有其他用途的字符;

\t:制表符
\n:换行符
\r:回车
\b:退格
\\:反斜杠
\':单引号
\":双引号
\xnn:以十六进制代码nn(n为0~F)表示一个字符,如\x41表示"A"
\unnnn:以十六进制代码nnnn表示一个Unicode字符

字符串类型转换
将其他类型数据转换为字符串型有三种方法:

1.每个字符串均有toString()方法
var a = 11,b;
a.toString()//"11"
b.toString()//对于只声明未赋值的变量或null,toString()将报错
2.String()函数对于任何类型的数据均有效
String(null)//"null"
String(undefined)//"undefined"
String(true)//"true"
3.空字符串""+其他类型数据
""+undefined//"undefined"
""+null//"null"

字符串与数组
字符串可以看作字符数组并且具有length属性,和真实数组不同的是该数组元素只能读不能写,并且没有数组相应的方法;


  • 布尔型
    布尔型数据使用truefalse表示,代表真或假,js中所有类型的数据都可以表示成布尔类型的数据;
    布尔类型数据转换
    可使用转型函数Boolean()可将数据转换为布尔型数据;

    除了以下六个数据外,其他类型的布尔值均为true
0
NaN
undefined
null
""
false

** 布尔型的应用场景**
布尔型数据往往结合流程控制语句用于执行条件代码块

var message = "hello world"
if(message){
  alter(message)
}

  • 对象类型
    对象本质上是由若干键值对构成的无序数据的集合;
    对象的创建
    对象创建的方法包括以下3种:
1.字面量法
var a = {a:1,b:2};
2.Object构造函数法
var b = new Object();
3.Object.create()法
var c = Object.create(null)

以上3种方法,字面量法最为简洁,Object方法比较正式,Object.create()常用于原型继承场景;
对象的读写操作
对象的键或值可看做对象的属性和方法,属性代表对象的特性,方法代表对象的能力;

//写操作
1.直接赋值
var a = {
    name:"teren",
    age:18,
    say:function(){
      console.log('hi')
    }
}
2.动态创建
a.height = 185
a.['weight'] = '60kg'
a.ability = function(){
    return "talk"
}
//读操作
a.name
a['age']

查看所有属性

Object.keys(a)


delete命令
delete命令用于删除对象的属性,但delete只能删除对象本身的属性,无法删除继承的属性;由var声明的全局变量默认是无法删除的;在Object.definedProperty方法的configurable定义为false的也不能删除;



in运算符
in运算符可用来判断对象的某个属性是否存在,但in无法判断这个属性是属于自身的还是继承的,可用Object.hasOwnProperty()去判断属性;


  • 数组
    数组是按照一定次序(起始编号为0的数字序列)的一组数据集合;
    数组的读写操作

    数组的length属性
    length属性是一个动态值,根据数组元素成员个数而发生变化;

    length属性是可写的,当length属性的长度大于当前长度,则会向数组添加undefined值,若小于当前长度则会删减值,可利用这一特性清空数组;

    数组的遍历
    数组的遍历最常用方法为for循环,此外还有forEach、for in和Object.keys();
var arr = [1,2,3,4]
for(var i=0;i<arr.length;i++){
    console.log(arr[i])
}
var arr = [1,2,3,4]
arr.foo = true;
for(var key in arr){
   console.log(key)
}
//0
//1
//2
//3
//4
//foo
[注]for...in循环不仅遍历数组的数字键,还会遍历非数字键,所以一般数组的循环遍历都采用for循环;
var arr = [1,2,3,4]
arr.forEach(function(value,key){
    console.log(key+"."+value)
})
var arr = [1,2,3]
console.log(Object.keys(arr))


类数组对象
js中有些对象被称作“类数组对象”,样子看上去很像数组,实际是个对象,并且没有数组的相关属性和方法,例如函数的arguments对象、DOM元素集和字符串;


可以使用Array.prototype.slice.call(likeArrayObject)使得类数组对象变成真实的数组;


3.小结

通过整篇文章,我们可以了解到:

  • JavaScript的代码是由一条条语句组成的,分号表示一条语句的结束;
  • 语句当中包含处理数据的表达式,表达式是可以得到返回值的计算式;
  • JavaScript是一门弱类型语言,使用var声明变量是,变量的数据类型将根据具体值而动态转变;
  • JavaScript的数据类型主要包括数值、字符串、布尔型、对象(狭义的对象、数组和函数)、undefined和null六种;
  • 数值、字符串、布尔型又称为基本数据类型,所有的数据都是由这三种最基本的数据类型构成,对象、数组和函数可称为复杂数据类型,由基本数据类型构成;
  • 数值类型的数据可通过不同的前缀表示不同进制的数值,也可用科学计数法表示,存在最值和无穷值;NaN是一个特殊的数值,常出现在不符合算术运算法则和无法将变量进行数据类型转换为数值的运算场景;数值类型转换的方法包括Number(),parseInt(),parseFloat()+
  • 字符串可以看做是放在引号内的零个或多个字符的数据;部分特殊字符需要转移符号反斜杠才能表示出来;字符串可以看做是类数组数据,可使用Array.prototype.slice.call(str)将其转变为真数组;字符串类型转换方法包括String()toString()""
  • 布尔型的值只有truefalse,js中所有类型的数据都可以表示成布尔类型的数据;布尔类型的数据转换方法有Boolean()!!;除了falsenullundefined0NaN""外,其他所有类型的数据的布尔值都是true
  • 对象本质上是若干键值对构成的无序数据的集合;对象的创建方法包括{}new ObjectObject.create(null);对象的读写操作可使用点操作方括号操作;遍历对象的方法有for...inObject.keys();可使用delete命令删除对象的自身属性,继承的属性、var声明的变量以及在Object.definedProperty({},"name",{value:"teren",configurable:false})也无法删除;
  • 数组是按照一定次序(起始编号为0的数字序列)的一组数据集合;数组的读写操作只能使用方括号操作;遍历数组的方法包括forforEachObeject.keys;类数组对象包括HTMLCollection对象函数的arguments对象以及字符串,可以使用Array.prototype.slice.call(likeArrayObject)使得类数组对象变成真实的数组;

参考资料

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 158,847评论 4 362
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 67,208评论 1 292
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 108,587评论 0 243
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 43,942评论 0 205
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,332评论 3 287
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,587评论 1 218
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,853评论 2 312
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,568评论 0 198
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,273评论 1 242
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,542评论 2 246
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,033评论 1 260
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,373评论 2 253
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 33,031评论 3 236
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,073评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,830评论 0 195
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,628评论 2 274
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,537评论 2 269

推荐阅读更多精彩内容

  • 第5章 引用类型(返回首页) 本章内容 使用对象 创建并操作数组 理解基本的JavaScript类型 使用基本类型...
    大学一百阅读 3,152评论 0 4
  • 第三章 基本概念 3.1 语法 ECMAScript标识符一般采用驼峰大小写格式,也就是第一个字母小写,剩下的每个...
    小雄子阅读 507评论 0 1
  • 喜欢一个人的独处时光,喜欢一个人背着行囊远走,喜欢一路走走停停,看看随行的风景。 在空无一人的他乡,感受到...
    496d090216f4阅读 329评论 0 0
  • 田恬第一次到锦盛大酒店,十多米高的中厅装修的豪华而又富贵。大厅后背整面墙上画了一幅巨大的山水国画,画风清奇,气势磅...
    拈花吟阅读 156评论 0 2
  • “热闹是他们的,而我什么也没有” 看到这句话时,我瞬间泪流满面。直到现在为止,我都觉着我自己是孑然一身的。把...
    hey王木木阅读 257评论 0 2