变量
什么是变量
白话: 变量就是一个装东西的盒子
通俗: 变量是用于存放数据的容器. 我们通过变量名获取数据, 甚至数据可以修改.
变量在内存中的存储
本质: 变量是程序在内存中申请的一块用来存放数据的空间
类似我们酒店的房间, 一个房间就可以看做是一个变量
变量的使用:
变量的在使用时分为两步: 1. 声明变量 2. 赋值
1. 声明变量
var age; // 声明一个名称为 age 的变量
var 是一个 JS 关键字, 用来声明变量. 使用该关键字声明变量后, 计算机会自动为变量分配内存空间, 不需要程序员管
age 是程序员定义的变量名, 我们要通过 变量名来访问内存中分配的空间
2. 赋值
age = 10;// 给 age 这个变量赋值为 10
= 用来把右边的值赋给左边的变量空间中, 此处代表赋值的意思
变量值是程序员保存到变量空间里的值
3. 变量的初始化
var age = 18; // 声明变量同时赋值为 18
声明一个变量并赋值, 我们称之为变量的初始化
变量语法扩展
1. 更新变量
一个变量被重新赋值后, 它原来的值就会被覆盖, 变量值将以最后一次赋的值为准
- var age = 18;
- age =81; // 最后的结果就是 81 因为 18 被覆盖掉了
2. 同时声明多个变量
同时声明多个变量时, 只需要写一个 var, 多个变量名之间使用英文逗号隔开
var age=10, gz=2000,name="xiaoxin";
3. 声明变量的特殊情况
情况 | 说明 | 结果 |
---|---|---|
var age; console.log(age); | 只声明,不赋值 | undefined |
console.log(age) | 不声明,不负责,直接使用 | 报错 |
age = 10; console.log(age); | 不声明 只赋值 | 10 |
变量命名规范
由字母 (A-Za-z), 数字 (0-9), 下划线(_), 美元符号($) 组成, 如: useAge,num01, _name
严格区分大小写, var App; 和 var App; 是两个变量
不能以数字开头. 18age 是错误的
不能是关键字, 保留字. 列如: var,for,while
变量名必须有意义, MMD BBD nl->age
遵守驼峰命名法. 首字母小写, 后面单词的首字母需要的大写. myFirstName
数据类型
2.1 为什么需要数据类型
在计算机中, 不同的数据所需占用的存储空间是不同的, 为了便于把数据分成所需内存大小不同的数据, 充分利用存储空间, 于是定义了不同的数据类型
2.2 变量的数据类型
变量是用来存储值的所在处, 它们有名字和数据类型. 变量的数据类型决定了如何将代表这些值的位存储到计算机的内存中. JS 是一种弱类型或者说动态语言. 这意味着不用提前声明变量的类型, 在程序运行过程中, 类型会被自动确定
JS 的变量数据类型是只有程序在运行过程中, 根据等号右边的值来确定的
JS 拥有动态类型, 同时也意味着相同的变量可用作不同的类型
- var x = 6; //x 为数字
- var x = "Bill"; //x 为字符串
2.3 数据类型的分类
JS 把数据类型分为两类 "
简单数据类型(Number,String,Boolean,Undefined,Null)
简单数据类型 | 说明 | 默认值 |
---|---|---|
Number | 数字型,包含整数型和浮点型值,如 21、0.21 | 0 |
Boolean | 布尔值类型,如 true、false 等价于 1 和 0 | false |
String | 字符串类型 如 "张三" 注意咱们 js 里面,字符串都带引号 | "" |
Undefined | var a;声明了变量 a 但是没有给值,此时 a=undefined | undefined |
Null | var a =null;声明了变量 a 为空值 | null |
数字型 Number:
数字型进制
最常见的进制有二进制, 八进制, 十进制, 十六进制
我们程序里面数字前面加 0 表示八进制 010 八进制转换为十进制为 8
数字的前面加 0x 表示十六进制
数字型范围
JS 中数值的最大值和最小值
Number.MAX_VALUE Number.MIN_VALUE
数字型三个特殊值
Infinity 代表无穷大 大于任何数值
-Infinity 代表无穷小 小于任何数值
NaN ,not a number 代表一个非数值
数字型里面的方法
isNaN() 这个方法用来判断非数字, 并且返回一个值, 如果是数字返回的是 false, 如果不是数字返回的是 true
字符串型 string
字符串引号嵌套
JS 可以用单引号嵌套双引号, 或者用双引号嵌套单引号(外双内单, 外单内双)
var strMsg = '我是" 高帅富 "程序员'
字符串转义符
转义符都是 \ 开头的, 但是要写到引号里面. 常用的转义符及其说明如下
转义符 | 解释说明 |
---|---|
\n | 换行符,n 是 newline 的意思 |
\ \ | 斜杠 \ |
\ ‘ | ‘ 单引号 |
\ * | " 双引号 |
\t | tab 缩进 |
\b | 空格,b 是 blank 的意思 |
字符串长度
字符串是由若干字符组成的, 这些字符的数量就是字符串的长度. 通过字符串的 length 属性可以获取整个字符串的长度
字符串拼接
多个字符串之间可以使用 + 进行拼接, 其拼接方式为字符串 + 任何类型 = 拼接之后的新字符串
拼接前会把与字符串相加的任何类型转成字符串, 再拼接成一个新的字符串 比如
alert('hello' + 'world') ;//hello world
我们经常会将字符串和变量来拼接, 因为变量可以很方便地修改里面的值, 变量是不能添加引号的, 因为加引号的变量会变成字符串
- var age = 18;
- console.log("邵祎"+age+"岁")
布尔型 Boolean
布尔类型有两个值: true 和 false 其中 true 表示真(对), 而 false 表示假(错)
布尔型和数字型相加的时候, true 的值为 1,false 的值为 0
console.log(true+1);//2
Undefined 和 Null
一个声明后没有被赋值的变量会有一个默认值 undefined(如果进行相连或者相加时, 注意结果)
- var variable;
- console.log(variable); //undefined
- console.log('你好'+variable); // 你好 undefined
- console.log(11+variable); //NaN
一个声明变量给 null 值, 里面存的值为空(学习对象时, 我们继续研究 null)
- var variable=null;
- console.log('你好'+variable); // 你好 null
- console.log(11+variable); //11
复杂数据类型(object)
获取检测变量的数据类型
typeof 可用来获取检测变量的数据类型
- var num = 12
- console.log(typeof(num)); // Number
2.4 数据类型转换
4.1 什么是数据类型转换
使用表单, prompt 获取过来的数据默认是字符串类型的, 此时就不能直接简单的进行加法运算, 而需要转换变量的数据类型. 通俗来说, 就是把一种数据类型的变量转换成另外一种数据类型
我们通常会实现 3 种方式的转换:
转换为字符串类型
转换为数字型
转换为布尔型
4.2 转换为字符串
方式 | 说明 | 案例 |
---|---|---|
toString() | 转成字符串 | var num=1; alert(num.toString()); |
String()强制转换 | 转成字符串 | var num = 1; alert(String(num)); |
加号拼接字符串 | 和字符串拼接的结果都是字符串 | var num = 1; alert(num+‘我是字符串‘); |
toString()和 String()使用方式不一样
三种转换方式, 我们更喜欢用第三种加号拼接字符串转换方法, 这一种方式也称之为隐式转换
4.3 转换为数字型(重点)
方式 | 说明 | 案例 |
---|---|---|
parselnt(string)函数 | 将 srting 类型转换成整数数值型 | parseInt("78") |
parseFloat(string)函数 | 将 string 类型转换成浮点数值型 | parseFloat("78.21") |
Number()强制转换函数 | 将 string 类型转换为数值型 | Number("12") |
js 隐式转换(- * /) | 利用算术运算隐式转换为数值型 | ‘12‘ - 0 |
注意: parseInt 和 parseFloat 单词的大小写, 这 2 个重点
console.log(parseInt('120px')); //120 会去掉这个 px 单位
隐式转换是我们在进行算数运算的时候, JS 自动转换了数据类型
4.4 转换为布尔型
方式 | 说明 | 案例 |
---|---|---|
Boolean()函数 | 其他类型转换成布尔值 | Boolean(‘true‘) |
代表空, 否定的值会被转换为 false, 如'',0,NaN,null,undefined
其余值都会被转换为 true
- console.log(Boolean('')); //false
- console.log(Boolean(12)); //true
- if(条件表达式){
- // 执行语句
- }
- // 条件成立 执行 if 里面代码 否则执行 else 里面的代码
- if (条件表达式){
- // [如果] 条件成立执行的代码
- }else{
- //[否则] 执行的代码
- }
- if(条件表达式 1){
- // 语句 1;
- }else if(条件表达式 2){
- // 语句 2;
- }else if(条件表达式 3){
- // 语句 3;
- }else{
- // 最后的语句;
- }
- for (初始化变量; 条件表达式; 操作表达式){
- // 循环体
- }
- for(外层的初始化变量; 外层的条件表达式; 外层的操作表达式)
- {
- for(里层的初始化变量; 里层的条件表达式; 里层的操作表达式)
- {
- // 执行语句;
- }
- }
- while(条件表达式){
- // 循环体代码
- }
- do{
- // 循环体
- } while(条件表达式)
- var arrStus = [1,2,3]
- // 获取数组中的第 2 个元素
- alert(arrStus[1])
- var arr = ['red','green','blue','pink']
- arr.length = 7
- console.log(arr[4]) //undefined
- var arr = ['red','green','blue','pink']
- arr[4] = 'gray'
- function cook(aru){
- // 形参是接收实参的 aru = '酸辣土豆丝' 形参类似于一个变量
- console.log(aru)
- }
- cook('酸辣土豆丝')
- function getSum(num1,num2){
- console.log(num1+num2)
- }
- // 只有函数才有 arguments 对象 而且是每个函数都内置好了这个 arguments
- function fn(){
- console.log(arguments[2]) // 返回 3
- + function fn1(){
- + console.log(111);
- + fn2();
- + console.log('fn1')
- +
- }
- + function fn2(){
- + console.log(222);
- + console.log('fn2')
- +
- }
- + fn1()
- function fn(){
- }
- fu();
- function fun(){
- var num1 = 10; //num1 就是局部变量, 只能在函数内部使用
- }
- + var num = 10;
- + function fn(){ // 外部函数
- + var num = 20
- + function fun(){// 内部函数
- + }
- + fun();
- + }
- + fn();
- + console.log(num) ;// 返回 undefined
- + var num = 10;
- + // 相当于执行了以下代码
- + var num;
- + console.log(num);
- + num = 10;
- + fn();
- + function fn(){
- + console.log(111)
- +
- }
- + person.name = '小鑫'
- + person.sex = '男'
- + person.age = 128;
- + person.height = 154;
- + var obj = {
- }; // 创建了一个空的对象
- + var obj = {
- + uname: '小鑫',
- + age : 18,
- + sex : '女',
- + sayHi : function(){
- + console.log('hi')
- +
- }
- +
- }
- var obj = new Object();// 创建了一个空的对象
- ?
- + obj.uname = '小鑫';
- + obj.age = 18;
- + obj.sex = '男';
- + obj.sayHi = function(){
- + console.log("小鑫喜欢邵祎");
- +
- }
- + function Stat(uname,age,sex){
- + this.name = uname
- + this.age = age
- + this.sex = sex
- + this.sing = function(){
- }
- +
- }
- + var ldh = new Stat('刘德华',18,'男'); // 调用函数返回的是一个对象
- + console.log(ldh.name); // 接着就可以使用访问对象的方式输出结果
- + for (变量 in 对象){
- +
- }
- + var obj = {
- + name: '小鑫',
- + age : 18,
- + sex : '男'
- +
- }
- + for (var k in obj){
- + console.log(k); //k 变量输出 得到的是 属性名
- + Math.PI // 圆周率
- + Math.floor() // 向下取整 往最小了取值
- + Math.ceil() // 向上取整 往最大了取值
- + Math.round() // 四舍五入版 就近取整 注意 - 3.5 结果是 - 3
- + Math.abs() // 绝对值
- + Math.abs('-1') // 隐式转换 会把字符串型 - 1 转换为数字型
- + Math.max() / Math.min() // 求最大值和最小值
- + fucntion getRandom(min,max){
- + return Math.floor(Math.random()*(max-min+1))+min
- +
- }
- + var date = new Date();
- + date.getFullYear();
- + var date = new Date();
- + console.log(date.valueOf()) // 就是 我们现在时间 距离 1970.1.1 总的毫秒数
- + console.log(date.getTime())
- + var arr = [1,2,3];
- + console.log(arr[0])
- + var arr1 = new Array(); // 创建了一个空的数组
- + var arr1 = new Array(2);// 这个 2 表示 数组的长度为 2 里面有 2 个空的数组元素
- + var arr1 = new Array(2,3);// 等价于[2,3] 这样写表示 里面有 2 个数组元素 是 2 和 3
- + var arr = []
- + console.log(arr instanceof Array) // 检测 arr 是否为数组 返回 True
- ?
- + var arr = [1,2,3]
- ?
- + var arr = [1,2,3]
- ?
- + var arr = ['pink','red','blue']
- + arr.reverse()
- + console.log(arr)
- ?
- ?
- + var arr1 = [3,4,7,1]
- + arr1.sort(function(a,b){
- ?
- + var arr = [1,2,3,4,5,6,7]
- + var arr1 = [8,9,10]
- + console.log(arr.concat(arr1)) #[1,2,3,4,5,6,7,8,9,10]
- ?
- ?
- + var arr = [1,2,3,4,5,6,7]
- ?
- + var arr = [1,2,3,4,5,6,7]
- var str = 'abc';
- str = 'hello'
- // 当重新给 str 赋值的时候, 常量'abc'不会被修改, 依然在内存中
- // 重新给字符串赋值, 会重新在内存中开辟空间, 这个特点就是字符串的不可变
- // 由于字符串的不可变, 在大量拼接字符串的时候会有效率问题
- ?
- + var str = 'andy'
- + for (var i = 0;i<str.length;i++)
- + {
- + str.charAt(i)
- + }
- ?
- ?
- + var str = 'andy'
- ?
- + var str = 'andy'
- + 3.str.toUpperCase() // 转换大写
- + 4.str.toLowerCase() // 转换小写
- + function fn(a){
- + a++;
- + console.log(a); // 输出 11
- +
- }
- + var x = 10;
- + fn(x)
- + console.log(x) // 输出 10
- + function Person(name){
- + this.name = name
- +
- }
- + function f1(x){
- x = p
- + }
- + var p = new Person('xiaoxin')
- + console.log(p.name) // 返回 xiaoxin
- + f1(p)
- + var num = 10;
- + function fn(){
- // 外部函数
- + var num = 20
- + function fun(){
- // 内部函数
- + } + fun(); + } + fn();
来源: http://www.bubuko.com/infodetail-3341723.html