请看代码并思考输出结果

var scope = 'global';
function f(){
console.log(scope);
var scope = 'local';
console.log(scope);
}
f(); var a = [];
console.log(a == ,a == false); var b = [];
console.log(b + ,b-); var c = {};
console.log(Boolean(c)==true);

对比答案

全部答对的同学,下文可不必阅读,我相信你的基础已经很扎实了^_^

没有答对也不要灰心,本文会巩固你的基础知识,后续会有系列的基础回顾知识,以飨诸君!

缘由

相信只要从事开发的同学,不论前端后端或多或少的使用过javascript这门语言。但对其深入理解的我相信并不在多数,我看过很多同学分享过的文章,说实话干货太少,自己的见解微乎其微,javascript基础知识也很少能看到有文章写到,万丈高楼始于平地,基础的重要性我一直认为不比前端框架低。主要来源于JS权威指南、网络资料以及自己的一些“偏见”。

数据类型

JavaScript两大类型:原始类型和对象类型

原始类型(primitive type)

null

undefined

string

number

boolean

五大原始类型:其中 null、undefined都是其类型的唯一成员,boolean成员只有true和false,number类型即为数值(js均以浮点型表示),string即为字符串类型(长度为16位),原始类型均为不可变类型,你无法改变数字1,也无法改变字符串h,更不可能将false改变成其它值,只有对象类型可变

对象类型(object type)

对象类型是属性的集合,大部分的对象都包含属性名、属性值(数组对象可以看成为从0开始的有序属性名),也就是名/值对,但函数是一个特殊的对象

常见的对象类型:

Array,Function,Math,Date,RegExp

类型转换

转换为字符串 数字 布尔值 对象
 undefined  "undefined"  NaN  false  throws TypeError
 null  "null"  0  false   throws TypeError
 true  "true"  1    new Boolean(true)
false  "false"   0    new Boolean(false)
""     0  false  new String(“”)
"1.1"     1.1 true   new String(“1.1”)
"ccy"    NaN  true   new String(“ccy”)
"0"   false   new Number(0)
-0  "0"    false   new Number(-0)
NaN  "NaN"     false   new Number(NaN)
Infinity   "Infinity "    true   new Number(Infinity)
-Infinity  "-Infinity "     true   new Number(-Infinity)
"1"     true   new Number(1)
{}  对象先转换原始值,
再有原始值进一步转化 
 同左  true   
[]     0  true   
[6]  "6"   6 true    
['a']  使用join()方法   NaN  true    
function(){}  "function(){}"   NaN  true    

JavaScript取值类型非常灵活,当期望使用一个布尔值时,你可以提供任意类型值,JavaScript会根据需要自行转换类型,字符串和数字也同样如此,原始类型的可通过对应的包装类转化成对象类型,具体转化请熟悉上表。理解类型转换,文章开头关于a,b,c的输出也就不在话下了。

变量声明

ES5时代JavaScript还不支持块级作用域,声明变量采用关键字var

如下所示:

var i;
var ccy,name;
var m = 0, k = 1,n = 'bar';

var声明的变量如果没有赋予初始值,则默认为undefined,变量可为任意数据类型。

变量作用域

一个变量的作用域是程序源代码中定义这个变量的区域。全局变量拥有全局作用于,在JavaScript中任何地方都是有定义的。然而在函数内声明的变量只有在该函数体内有效,也就是局部变量,函数参数也是局部变量。

学过Java的同学应该知道就近原则的说法,类变量与方法中的变量同名时在该方法或者构造函数体内类变量是会被其覆盖掉,JavaScript也遵循这一原则。

var关键字存在声明提前的bug,在非严格模式下不会报错。由此文章开头关于方法的输出等价于

function f(){
var scope;
console.log(scope);
var scope = 'local';
console.log(scope);
}

理解变量声明及作用域,文章开头的输出亦不在话下了。

作用域链

JavaScript是基于词法作用域的语言,全局变量在程序中始终有定义,局部变量在声明的函数题内以及其所嵌套的函数内始终是有定义的。

每段JavaScript代码都有一个与之关联的作用域链(scope chain),这个作用域链是一个对象列表或链表,这组对象定义了这段代码的“作用域中”的变量,当需要查找变量X的值时(变量解析),它会从链中的第一个对象开始查找,若有则直接使用,若没有则向上查找,以此类推,若作用域链不存在X则抛出ReferenceError异常。

希望本文能对您有所收获,祝好!

JavaScript基础回顾一(类型、值和变量)的更多相关文章

  1. Javascript基础回顾 之(一) 类型

    本来是要继续由浅入深表达式系列最后一篇的,但是最近团队突然就忙起来了,从来没有过的忙!不过喜欢表达式的朋友请放心,已经在写了:) 在工作当中发现大家对Javascript的一些基本原理普遍存在这里或者 ...

  2. Javascript基础回顾 之(三) 面向对象

    本来是要继续由浅入深表达式系列最后一篇的,但是最近团队突然就忙起来了,从来没有过的忙!不过喜欢表达式的朋友请放心,已经在写了:) 在工作当中发现大家对Javascript的一些基本原理普遍存在这里或者 ...

  3. Javascript基础回顾 之(二) 作用域

    本来是要继续由浅入深表达式系列最后一篇的,但是最近团队突然就忙起来了,从来没有过的忙!不过喜欢表达式的朋友请放心,已经在写了:) 在工作当中发现大家对Javascript的一些基本原理普遍存在这里或者 ...

  4. JavaScript 基础回顾——对象

    JavaScript是基于对象的解释性语言,全部数据都是对象.在 JavaScript 中并没有 class 的概念,但是可以通过对象和类的模拟来实现面向对象编程. 1.对象 在JavaScript中 ...

  5. JavaScript 基础回顾——函数

    在JavaScript中,函数也是一种数据类型,属于 function 类型,所以使用Function关键字标识函数名.函数可以在大括号内编写代码并且被调用,作为其他函数的参数或者对象的属性值. 1. ...

  6. 原生 javascript 基础回顾

    (1)打开新窗口 语法: window.open([URL], [窗口名称], [参数字符串]) 参数说明: URL:可选参数,在窗口中要显示网页的网址或路径.如果省略这个参数,或者它的值是空 字符串 ...

  7. JavaScript 基础回顾——数组

    JavaScript是无类型语言,数组元素可以具有任意的数据类型,同一个数组的不同元素可以具有不同类型.数组的元素设置可以包含其他数组,便于模拟创建多维数组. 1.创建数组 在JavaScript中, ...

  8. Javascript基础系列之(二)变量

    javascript 中变量通过var关键字(variable)来声明的. var school = "beijingyizhong" 也可以通过var 关键字给变量多个值. va ...

  9. javascript基础篇--function类型(上)

    在js中,function类型实际上是对象,每一个函数都是function类型的一个实例.并且与其它引用类型一样具有属性和方法. 声明 1普通方式 Function sum(num1,num2) { ...

随机推荐

  1. [f]聊天的时间格式化

    代码如下: 参数: t: 时间戳, type:返回格式(1:IM界面,其他:会话列表) function formartTime(t, type) { var oldtime = new Date(t ...

  2. 09-JS的事件流的概念(重点)

    在学习jQuery的事件之前,大家必须要对JS的事件有所了解.看下文 事件的概念 HTML中与javascript交互是通过事件驱动来实现的,例如鼠标点击事件.页面的滚动事件onscroll等等,可以 ...

  3. <<君主论>>读后感

    “<君主论>与<圣经>齐名,被称为邪恶的圣经,这本书的立论基础是人性本恶论,他所描述的人性之恶,主要是以西欧资本原始积累背景下的现实社会中人的各种丑恶现象为蓝本的.” 要是高中 ...

  4. Vue.js——快速入门

    Vue.js是当下很火的一个JavaScript MVVM库,它是以数据驱动和组件化的思想构建的.相比于Angular.js,Vue.js提供了更加简洁.更易于理解的API,使得我们能够快速地上手并使 ...

  5. python 初级重点

    关于python初学时遇到的重点: 1 python 2 和3 的区别 python2**不识别中文** -*- coding: utf-8 -*-(因为不能识别中文,所以代码有中文时需要在最前面加入 ...

  6. Lesson 22 A glass envelope

    Text My daughter, Jane, never dreamed of receiving a letter from a girl of her own age in Holland. L ...

  7. C#遍历文件夹下面所有指定格式文件

    C#遍历指定文件夹中的所有文件 DirectoryInfo TheFolder=new DirectoryInfo(folderFullName);//遍历文件夹foreach(DirectoryIn ...

  8. linux mint 安装 opencv2.4

    Download opencv https://github.com/opencv/opencv/tree/2.4 安装必要的依赖 sudo apt-get install build-essenti ...

  9. Fiddler修改请求、返回数据

    相信你们有听过说“绕过前端”,但是可能想不到要怎样才能绕过前端呢? 首先,我们要知道什么是绕过前端?比如:登录用户名限制数字.6位,用户在登录页面填写用户名符合要求,使用Fiddler作为代理,拦截登 ...

  10. okHttp超时报错解决方案

    Android 使用okhttp,如果客户端等待的时间超过了okHttp的默认时间,就会报错java.net.SocketTimeoutException: timeout 所以,需要在调用okHtt ...