变量

在程序中将一个值指定(assign)给一个符号式的容器(symbolic container),叫做一个变量(variable)。

声明
在JS中目前提供了三种声明方式:

var

声明一个变量,可选择是否给予一个初始值。

作用范围(scope)于该函式之内;但是如果在函式外声明,其作用范围则为全局性(global)。

var price = 10;

price = price * 2;

console.log(price);

let(ES6新增)

声明一个内存块范围(scope)内的本地变量,可选择是否给予一个初始值。

let prices = 10;

if(prices === 10){

let prices = 20;

console.log(prices);// 20

}

console.log(prices);// 10

const(ES6新增)

声明一个只能读取内存块范围(scope)内的本地变量。

const price = 10;

console.log(price);//10

price = 20;//Uncaught TypeError: Assignment to constant variable.

如果在声明时候未给予值,JS会预设为undefined(除了const)

var a;

console.log(a)//undefined

let b;

console.log(b)//undefined

const c;

//Uncaught SyntaxError: Missing initializer in const declaration

命名规则

在命名时候需要注意下面几点规则:

开头不能数字

英文大小写是有区分的

不可使用保留字元

在MDN中有列出了哪些是JS的保留字元。

函式

程序拆解成可重复使用的片段

具名代码片段(a named section of code)可以藉由名称来呼叫执行。

可选择是否接受参数(arguments即参数(parameters))

声明
函式由三个关键字组成,依序是:

名称

参数列表

大括号{}

这边举个例子:

function totalPrice(number,price){

return number*price

}

totalPrice(2,20)

函式totalPrice使用了两个参数number和price,两着相乘后透过return回传其值。

函式通常会有回传值,但并非每种函式都需要回传值,也有可能利用输出的方式来输出结果。

function totalPrice(number,price){

console.log(number*price)

}

totalPrice(2,20)//40

在声明函式时可以选择不撰写名称,这将会使函式成为一个匿名函式,通常作为一个指定值,指定给一个变量后,该变量便成为了这个匿名函式的名称。

var total = function(number,price){

console.log(number*price)

}

total(2,20)//40

以函式作为参数传入

在JS中也能将函式做完参数传入到另一个函式,而且在函式的最后也可以回传函式。这种函式的结构称之为高阶函式(Higher-order function)。我们常听到的callback就是高阶函式的应用,不过这会在很后面才提到。在这边只需要了解函式也能当作参数即可。

var total = function(count,fn){

return fn(count)

}

var price = function(count){

return count * 20

}

console.log(total(10,price))//200

参考资料:

变量、常数与命名

https://eyesofkids.gitbooks.io/javascript-start-from-es6/content/part3/function_scope.html

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Guide/Functions

https://developer.mozilla.org/zh-TW/docs/Web/JavaScript/Reference/Statements

学习JS的心路历程-声明的更多相关文章

  1. 学习JS的心路历程-函式(一)

    前几天有间单提到该如何声明函式及在Hositing中会发生什么事,但是函式的奥妙不仅于此. 身为一个使用JS的工程师,我们一定要熟悉函式到比恋人还熟! 这几天将会把函式逐一扒开跟各位一起探讨其中的奥妙 ...

  2. 学习JS的心路历程-参数的传递(下)

    今天我们要来探讨JS到底是透过何种参数传递方式呢? 废话不多说,上示例!! 我们先声明原始型别和物件型别来看看两者是否会有不一样的差异: var myStr = 'Hola': var myObj = ...

  3. 学习JS的心路历程-参数传递方式(上)

    很多人认为JS的传递方式是值是Call by value, 物件及数组是Call by Reference.甚至还有人宣称其实JS是Call by sharing,那到底是哪一个呢? 这两天我们一一来 ...

  4. 学习JS的心路历程-范围Scope和提升(Hoisting)

    在上一篇提到了JS有三种声明变量的方式,分别是var.const及let,var和const let最大区别就是范围(scope)的限制.所以在这一篇我们会详谈何谓范围链及他们的复写优先级. 范围Sc ...

  5. 学习JS的心路历程-类型

    前言 之前学JS时候都是靠着谷狗一路跌跌撞撞的学过来,从来没有去翻过MDN的文件,导致留了许多技术债给自己. 最近有幸遇到一位前辈并开始从头学JS,前辈表示学程序不看文件是想作死自己?于是我的第一份功 ...

  6. 学JS的心路历程 -函式(三)this

    this是什么,取决于被呼叫的呼叫地点. 昨天有提到说,呼叫函式时候会传递隐含参数:arguments和this并讲解了arguments,今天我们就来探讨this吧! 什么是this 我们都会呼叫函 ...

  7. 学JS的心路历程-函式(二)arguments

    参数(argument)与函式参数(parameter) 在讨论函式时,很多人都会把这两个搞混,我自己也不例外. 虽然讲错别人也听得懂,但是我们还是要搞清楚这两个的定义到底是什么! 参数是当我们呼叫函 ...

  8. .net工程师学习vue的心路历程(一)

    实习一年后,想做一个属于自己的博客网站,准备用core api去搭建服务端接口,前端准备采用vue这样的一个框架.本身时一个服务端程序员,所以来学习记录一些vue的知识点,有什么不足的希望大家指正,谢 ...

  9. .net工程师学习vue的心路历程(三)

    vue cli3没记错的话是在2019年8月份yyx个人正式声明发布. 接下来就开始我们的vue cli3的方式创建vue项目.明白一点,vue cli3遵循的一个原则就是 "0配置&quo ...

随机推荐

  1. 「2017 山东一轮集训 Day5」距离

    /* 写完开店再写这个题目顿时神清气爽, 腰也不疼了, 眼也不花了 首先考虑将询问拆开, 就是查询一些到根的链和点k的关系 根据我们开店的结论, 一个点集到一个定点的距离和可以分三部分算 那么就很简单 ...

  2. es6(10)--Set,Map(1)

    //Set { let list=new Set(); list.add(5);//添加 list.add(7); //属性size就是长度 console.log('size',list.size) ...

  3. 零基础学习python_类和对象(36-40课)

    今天我们开始学习面向对象的知识咯,之前我对面向对象也学的懵懵的,因为感觉知道好像又不是特别清楚,接下来我们一起来学习类和对象吧.零基础的课程我都是看小甲鱼的视频学的,没基础的可以去这个网址下载视频学习 ...

  4. 关于basler线阵相机和Mtrox采集卡的安装

    说明: 本系列博文是我自己研究生课题,采用做一步记录一步,在论文答辩结束或者机器设计结束之后才会附上源代码! 以前都是用opencv,直接拿个照片去处理,基本都是软件的使用,这次做课题要用到Matro ...

  5. C#打印0到100的素数

    static void Main(string[] args) { //输出1-100的素数 bool res; ; ; i < ; i++) { res = true; ; j < i; ...

  6. ROS-by-example的安装

    在这里我之前用的VM12安装成功之后,仿真器机器人会有问题,故把电脑做成双系统的形式来重新安装: 环境:Ubuntu14.04 LTS 32bits ROS版本:ROS Indigo 在学习本部分之后 ...

  7. Running a jupyter notebook server

    你也许需要服务器运行jupyter notebook 阿里云: https://yq.aliyun.com/articles/98527 关于更安全的证书访问: http://jupyter-note ...

  8. 42.纯 CSS 创作一个均衡器 loader 动画

    原文地址: https://segmentfault.com/a/1190000015157160 感想: 不难,最简单的动画.拓展地址: https://scrimba.com/c/cWqVv9hd ...

  9. Mybatis七(MBG 逆向工程)

    官方地址:http://www.mybatis.org/generator/ https://github.com/mybatis/generator/releases <1>编写mbg. ...

  10. 看到的一个关于C++能力分级的描述

    精通没有标准,但学习有路径. 我来说说 学习掌握C++的路径吧,从低到高,分0-10级: 0级:掌握常见C++语法和语言构造,能够顺溜地写清楚各种语言构造(很多小白鼠死在这里)1级:掌握基本的编程范式 ...