JavaScript的基本概念、基础语法(数据类型、运算符)

1、什么是JavaScript?

JavaScript一种直译式脚本语言,是一种动态类型、弱类型、基于原型的语言,内置支持类型。它的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在HTML(标准通用标记语言下的一个应用)网页上使用,用来给HTML网页增加动态功能。

在1995年时,由Netscape公司的Brendan Eich,在网景导航者浏览器上首次设计实现而成。因为NetscapeSun合作,Netscape管理层希望它外观看起来像Java,因此取名为JavaScript。但实际上它的语法风格与SelfScheme较为接近。

为了取得技术优势,微软推出了JScript,CEnvi推出ScriptEase,与JavaScript同样可在浏览器上运行。为了统一规格,因为JavaScript兼容于ECMA标准,因此也称为ECMAScript

以上摘自百度百科,从这段论述我们可以看出JavaScript:

  • 直译式脚本语言、动态类型、弱类型、基于原型的语言;
  • 解释器为JavaScript引擎(浏览器的一部分);
  • 广泛应用于客户端,最早用于给HTML网页增加动态功能;
  • 诞生于1995年,在网景导航者浏览器上设计实现;
  • 与java没有关系,兼容ECMA标准,也被称为ECMAScript。

2、JavaScript的基本构成

英语语法是针对英语语言进行研究后,系统地总结归纳出来的一系列语言规则。语法是组词造句的规则,是把合适的词放进合适位置的语言(句子)规则,语法可以分成为两大部分:分别为词法和句法。词法包括各类词的形态及其变化,句法主要讲句子的种类和类型,句子成分以及遣词造句的规律。语法的精髓在于掌握语言的使用。

以上摘自百度百科(英语语法的定义),从这段论述我们可以看出英文的语法实质上:

  • 是组词和造句的一系列规则;
  • 主要分为词法和句法,实质上英文就是由单词和语句构成。

标示符与关键字

虽然自然语言和编程语言有一定差异,但我个人感觉原理上的东西应该是想通的,JavaScript作为一门脚本语言,它的基本构成部分应该就是标示符与语句。标示符类似于英文中的单词,而语言类似于英文中的短语,当然各自的功能是不同

  • 所谓标示符是JavaScript中定义的符号的名字,他可以是变量、函数、属性的名字,也可以是函数的参数名等等。其命名应该注意:
  • 区分大小写;
  • 第一个字符必须是字母、下划线(_)、或者是$;
  • 后面可以是字母、数字、下划线、$;

另外需要注意关键字和保留字!

  • 关键字是JavaScript引擎使用的的一些字,如果标示符使用关键字,那么可能会影响程序的正常运行,以下为关键字:
    break else new var
    case finally return void
    catch for switch while
    continue function this with
    default if throw
    delete in try
    do instanceof typeof

  • 保留字是JS未来在发展演变过程中可能用到的的字符,因此也不能用来做标示符,以下为保留字:
    abstract enum int short
    boolean export interface static
    bye extends long super
    char final native synchronized
    class float package throws
    const goto private transient
    debugger implements protected volatile
    doubler import public

变量的输出方式

输出变量的方式主要有四种:alert(),console.log(),document.write,document.title;

语句(statement)

  • 语句(statement)是为了完成某种任务而进行的操作;
  • JavaScript中语句以;结束,一行可以包含多条语句,如果省略分号不会产生语法错误,解释器会自动判断语句结束;

3、数据类型及分类

JavaScript语言的每一个值,都属于某一种数据类型。JavaScript的数据类型,共有六种。

  • 数值(number):整数和小数(比如1和3.14)
  • 字符串(string):字符组成的文本(比如"Hello World")
  • 布尔值(boolean):true(真)和false(假)两个特定值
  • undefined:表示“未定义”或不存在,即此处目前没有任何值
  • null:表示空缺,即此处应该有一个值,但目前为空
  • 对象(object):各种值组成的集合

原始类型和复杂类型

  • 数值、字符串、布尔值称为原始类型(primitive type)的值,即它们是最基本的数据类型,不能再细分了。

  • 将对象称为复杂类型(complex type)的值,因为一个对象往往是多个原始类型的值的合成,可以看作是一个存放各种值的容器。对象又可以分成四个子类型:

  • 狭义的对象(object)

  • 数组(array)

  • 函数(function)

  • 正则表达式 (regexp)

  • 至于undefined和null,一般将它们看成两个特殊值。

  • null表示空值,表示该处的值现在为空;

  • undefined表示未定义,即此处的值目前是不存在的;

字符串类型

js中双引号与单引号包裹的字符,都是字符串数据类型,但是与php不同的是,双引号并不能够解析变量;


字符串类型
  • 上图可以看出,双引号并不能够解析变量

undefined数据类型

使用var声明变量但是未对其进行初始化时,该变量的值就是undefined;

简单实例1

也就是说变量声明了,但是未初始化,此时变量默认的值就是undefined;

  • 值得注意的是未初始化的变量和尚未定义的变量有一定的区别:虽然使用typeof操作符来进行数据类型判断的时候,都是返回的是undefined;

Null数据类型

从逻辑角度来看,null值表示一个空对象指针,因此使用typeof操作符检测的null的时候,返回的都是object;


typeof检测null返回的是object

如果定义的变量准备在将来保存对象,则最好将该变量初始化为null而 不是其他值;

布尔类型(boolean)

布尔值代表“真”和“假”两个状态。“真”用关键字true表示,“假”用关键字false表示。布尔值只有这两个值;

  • 要注意的是:
    true和false是区分大小写的,也就是说False和True都不是布尔值,只是标识符 ;

下列运算符会返回布尔值:

  • 两元逻辑运算符: && (And),|| (Or)
  • 前置逻辑运算符: ! (Not)
  • 相等运算符:===,!==,==,!=
  • 比较运算符:>,>=,<,<=

在这里需要注意的是:如果JavaScript预期某个位置应该是布尔值,会将该位置上现有的值自动转为布尔值。转换规则是除了下面六个值被转为false,其他值都视为true:

  • undefined
  • null
  • false
  • 0
  • NaN
  • ""(空字符串)
需要特别注意的是这几种特殊情况

需要特别注意的是,空数组([])和空对象({})以及字符串"0"对应的布尔值,都是true。

Object

对象,就是一种无序的数据集合,由若干个“键值对”(key-value)构成。key我们称为对象的属性,value可以是任何JavaScript类型,甚至可以是对象.
对象可以这么写:
var o = new object(); o.name = 'wuyanwen'; o.age = '24 ;'
但是更加常用 的写法是这样的
var o ={ name: ' wuyanwen'; age: '24 '; }
key可以使用引号包裹,也可以直接写,对象有一个默认的方法toString,用来返回对象的字符串表示,如下所示:

4、运算符

  • 算术运算符

  • 赋值运算符

赋值运算符用于给变量赋值,最常见的赋值运算符,当然就是等号,表达式x=y表示将y赋值给x。除此之外,JavaScript还提供其他11个赋值运算符。

  • 比较运算符

比较运算符比较两个值,然后返回一个布尔值,表示是否满足比较条件。JavaScript提供了8个比较运算符。

  • 布尔运算符

  • 小括号

在JavaScript中,圆括号是一种运算符,它有两种用法:

  • 如果把表达式放在圆括号之中,作用是求值;

  • 如果跟在函数的后面,作用是调用函数。
    把表达式放在圆括号之中,将返回表达式的值。

  • void

void运算符的作用是执行一个表达式,然后返回undefined。

  • 逗号运算符

逗号运算符用于对两个表达式求值,并返回后一个表达式的值。

5、运算符优先级和结合性

有的运算符左结合,有的运算符右结合。

  • 1.typeof的优先级非常高,比加减乘除的优先级都要高,因此我们在进行复杂运算的时候,应该注意加括号;

  • 2.++、--是右结合的操作符(优先级最高的几个都是右结合),而且比加减乘除优先级高。同时自增、自减运算符的运算数得是左值(可以放在赋值符号左边的值),而不能是常数;

    1. 赋值运算符的优先级非常的低;
  • 4.逻辑非!也在优先级队列的前端,比加减乘除高,但逻辑与、逻辑或优先级很低,不如加减乘除

详细参考

复习部分:

1、JavaScript 定义了几种数据类型? 哪些是原始类型?哪些是复杂类型?原始类型和复杂类型的区别是什么?

JavaScript定义了6种数据类型,其中number、string、boolean为原始类型,而对象(Object)是复杂类型,原始类型和复杂类型的区别主要在于原始类型不可以再进行数据类型的分类,而复杂类型比如说对象(Object)一般是几个原始类型值的组合。

2、typeof和instanceof的作用和区别?

JavaScript有三种方法可以确定一个值到底是什么数据类型:

  1. typeof运算符;
  2. instanceof运算符;
  3. Object.prototype.toString方法;
利用typeof运算符确定原始类型数据类型.jpg
  • 1、typeof运算符对于原始类型number、string、boolean分别返回number 、string、以及boolean;
利用typeof运算符确定原始类型数据类型.jpg
  • 2、typeof运算符对于undefined类型,返回undefined,利用这一点可以利用typeof运算符来检查一个没有声明的变量,而不报错;
  • 3、typeof运算符对于函数 返回function;
  • 4、除了以上几种情况,其他情况情况一般返回为object(对象);

instanceof运算符:
instanceof用于判断一个变量是否某个对象的实例,运算符返回一个布尔值。instanceof只能用来判断对象和函数,不能用来判断字符串和数字等。(这部分留待后续进行深入的研究)

3、如何判断一个变量是否是数字、字符串、布尔、函数?

我们可以利用typeof运算符来判断一个变量的数据类型。

4、NaN是什么? 有什么特别之处?

NaN即为Not a Number,表示是一个非数字,NaN与任何值都不相等,包括它自己。NaN是属于数字类型的。

5、如何把非数值转化为数值?

有三个函数可以将非数值转换为数值:

三种将非数值转化为数值的方法.jpg
  • 1、Number()
  • 2、parseInt()
  • 3、parseFloat()

6、==与===有什么区别?

== 叫做相等运算符;
=== 叫做严格运算符;
严格运算符(===)的运算规则如下:

  • (1)不同类型值
    如果两个值的类型不同,直接返回false;

  • (2)同一类型的原始类型值
    同一类型的原始类型值(数值,布尔值,字符串)比较时,值相同就返回true,值不同返回false;

  • (3)同一类型的复杂类型值
    两个复合类型(对象、数组、函数等)数据比较时,不是比较他们的值是否相等,而是比较他们是否指向同一个对象;

  • (4)undefined和null
    undefined 和 null 与自身严格相等。

相等运算符(==)在比较相同类型的数据时,与严格相等运算符完全一样;
在比较不同类型的数据时,相等运算符会先将数据进行类型转换,然后再用严格相当呢个运算符比较。

  • (1)、原始类型的值
    原始类型的数据会转换成数值类型再进行比较,字符串和布尔值会转换成数值,然后再进行比较;

  • (2)、对象和原始类型值的比较
    对象(指广义的对象,包括数值和函数等)与原始类型的值比较时,对象转换为原始类型的值,再进行比较;

  • (3)、undefined和null
    undefined和null与其他类型的值比较时,结果都为false,他们互相比较时结果是true;

  • (4)、在这里要注意一些相等运算符的的缺点
    相等运算符隐藏的类型转换,会带来一些违反直觉的结果。

建议使用严格相等符(===),这样能够减少代码的其他异常问题。

知乎的相关讨论

7、break与continue有什么区别

break与continue两个英文意思一个是破坏,一个是持续,两者区别可以这样理解:

假如工厂存在一条循环回用流水线,当执行到某工段的时候break了,整条循环回用生产线直接全线停产,执行后续生产线的的工作内容,(相当于跳出了这个循环);

而continue则是执行到某工段后,满足了某个特定条件 ,直接略过循环生产线的后续工作内容,再次从头开始.
这么说可能太抽象了,还是举两个例子吧!
for(var i = 1; i< 10; i++){ if(i % 4 === 0){ break; } console.log(i); }

for(var i = 1; i< 10; i++){ if(i % 4 === 0){ continue; } console.log(i); } console.log("continue略过了i===4的阶段,执行后续的循环,循环结束后,执行循环体后操作")

image.png

8.void 0 和 undefined在使用场景上有什么区别?

void 0 的值永远都是undefined,而undefined在某些时候可以被赋值,如果需要判断一个变量的值是否为undefined,用void 0 比较有保证

9.

10.

11.

12.

13.

14.1

14.2

14.3

14.4

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

推荐阅读更多精彩内容