210405javascript

//弱类型特性

数据类型
原始类型:number string boolean null undefined
对象类型:object

隐式转换

巧用+,-

javascript是一种运行在浏览器中的解释型编程语言
web世界里,只有js能跨平台,跨浏览器驱动网页,与用户交互。
新兴的nodejs把js引入到服务器端。

<script type="text/javascript">
  //type的默认值是javascript
</script>

运行JavaScript方式:
必须有一个HTML页面,在HTML页面中引入JavaScript,让浏览器加载HTML页面,就可以执行JavaScript代码。
特别的:
直接打开新建的包含JavaScript的html页面有时候会有问题,由于浏览器的安全限制,以‘file://’开头的地址无法执行如联网等JavaScript代码,还需要架设一个web服务器,以‘http://’开头的地址正常执行所有代码。

目前最主流的三个Web服务器是Apache、 Nginx 、IIS。

javascript区分大小写

数据类型

1.Number
以下都是合法的Number类型
123;0.256;1.235;-99;NaN;Infinity;

2.字符串
1.以单引号和双引号括起来的任意文本,双引号和单引号是一种表示方式,不是字符串的一部分。例如‘abc’只有‘a’,'b','c'这3个字符。
2.字符串中包含引号时候,用转义字符\转义即可
3.多行字符串使用反引号 ``(反引号在键盘的ESC下方,数字键1的左边)
4.模板字符串
多行字符串拼接包含变量时 var message = 你好, ${name}, 你今年${age}岁了!;
5.字符串是不可变的,若对字符串的某个索引赋值,不会有报错也没效果,字符串的一些方法不会改变原有字符串的内容而是返回一个新字符串

var s = 'Hello';
var lower = s.toLowerCase();// hello  转小写
var upper = s.toUpperCas();//HELLO 转大写
s.indexOf('o');// 4  搜索指定字符串出现的位置 索引从0开始
s.substring(0,2)//He  从0开始到2,不包含2
s.substring(0)//Hello从0开始到最后

3.布尔值
只有true false两种值
相等运算符有两种:

  1. == 自动转换数据类型再比较,会得到诡异的结果
  2. === 不会自动转换数据类型,类型不一致,返回false,类型一致,再比较。
NaN === NaN // false NaN和任何值都不相等
isNaN(NaN)//true 只能通过isNaN()这种方式判断
1/3 === (1 - 2/3); //false 浮点数运算过程中会产生误差,因为计算机无法精确表示无限循环小数。
//若比较两个浮点数,只能计算他们之差的绝对值是否小于某个阈值
Math.abs(1/3 - (1 - 2/3)) < 0.0000001//true

4.null和undefined
null表示一个‘空’的值,表示‘空’
0:是一个数值
‘’:长度为0的字符串
undefined:表示未定义,仅仅在判断函数参数是否传递的情况下有用

5数组
是一组按顺序排列的集合,集合的每个值称为元素。数组可以包括任意数据类型

//slice()对应字符串中的substring()方法,截取数组中的元素
var arr = ['A', 'B', 'C', 'D', 'E', 'F', 'G'];
arr.slice(0,3)// 从0开始,到3结束,不包括3,返回['A', 'B', 'C']
//splice()修改数组的万能方法,从指定索引开始删除若干元素,从该位置添加若干元素
var arr = ['Microsoft', 'Apple', 'Yahoo', 'AOL', 'Excite', 'Oracle'];
arr.splice(2,3,'newadd1')// 从索引2开始删除3个元素,在索引2处添加newadd1  返回['Yahoo', 'AOL', 'Excite']
arr//['Microsoft', 'Apple', 'newadd1', 'Oracle'];

6对象
是一组由键值组成的无序集合,键都是字符串类型,值可以是任意类型。例如下面
var person= {
name:'aa',
age:20,
tags:['js','web'],
zipcode:null
}
要过滤掉对象继承的属性,用hasOwnProperty()来实现:

var o = {
    name: 'Jack',
    age: 20,
    city: 'Beijing'
};
for (var key in o) {
    if (o.hasOwnProperty(key)) {
        console.log(key); // 'name', 'age', 'city'
    }
}

es6中心的数据类型Map,是为了解决对象中键必须是字符串,数字和其他类型不能做为键的问题。
Map是一组键值对的结构,具有极快的查找速度。
初始化Map需要一个二位数字,或者直接初始化一个空的Map
Set是一组key的集合,不存value,由于key不能重复,故set中没有重复的key,需要提供一个array作为输入,或者创建一个空的set

//查找某个同学的成绩,先找到名字,再根据名字位置找到分数,数组越大耗时越长
var names = ['Michael', 'Bob', 'Tracy'];
var scores = [95, 96, 97];
//map实现方式
var m = new Map([['Michael',95],['Bob',96],['Tracy',97],]);
m.get('Michael')//95
console.log(m)//{"Michael" => 95, "Bob" => 96, "Tracy" => 97}
//map的方法
var m = new Map();
m.set('aa',67)//添加值
console.log(m)//{"aa" => 67}
m.has('aa')//是否存在  true
m.get('aa')// 获取值 67
m.delete('aa')//删除 aa
var s = new Set([1, 2, 3, 3, '3']);
s; // Set {1, 2, 3, "3"} 重复元素在set中自动过滤
s.add(4)//添加元素
s.delete(4)//删除元素

遍历map和set的方法是 for(var x of map),更好的方式是iterable的内置forEach方法,接收一个函数,每次迭代自动回调该函数

//for in循环的历史遗留问题:会把自定义添加的属性遍历出,但length属性却不包括在内。
var a = ['A', 'B', 'C'];
a.name = 'Hello';
for (var x in a) {
    console.log(x); // '0', '1', '2', 'name'
}
a.forEach(function (element, index, array) {
    // element: 指向当前元素的值
    // index: 指向当前索引
    // array: 指向Array对象本身
    console.log(element + ', index = ' + index);
});

变量
命名规则:英文字母,数字,$,_,不可数字开头,不可包含关键字(if,while)
赋值 :x = x + 2,先执行x+2 再执行赋值
strict模式 :强制通过var申明变量,未使用var申明变量就使用的,将导致运行错误。
启用strict模式的方法是在JavaScript代码的第一行写上 'use strict';

函数体内部的语句在执行时,一旦遇到return时,函数执行完毕,并将结果返回。若没有return语句,执行完也会返回结果,只是结果是undefined。return返回多行结果时,js引擎在行末自动添加分号机制,会有个坑

//错误写法
function foo() {
    return; // 自动添加了分号,相当于return undefined;
        { name: 'foo' }; // 这行语句已经没法执行到了
}
//正确写法
function foo() {
    return{ // 这里不会自动加分号
        name: 'foo' 
      }; 
}

函数传参:由于可以传任意个参数即使用不到,所以取所有的参数的方法 rest参数只能写在最后,前面用...标识

function foo(a,b,...rest){
  console.log(a);
  console.log(b);
  console.log(rest);
}

foo(1,2,3,4,5)
//a=1
// b=2 
//[3,4,5]

解构赋值:可以同时对一组变量进行赋值
对象结构赋值:保证对应层次一制

var [x, y, z] = ['hello', 'javascript', 'es6'];
console.log(x)//hello
let [,, z] = ['hello', 'javascript', 'es6']
console.log(z)//es6  前面参数可以忽略
let person = {
  name:'tt',
  age:20,
  address: {
    city:'beijing',
    street:'No.1 road'
  }
}
var {name, address:{city,street}} = person
console.log(city)//beijing  address不是变量,只是为了让city获得嵌套的属性
var {name,age:id} = person
console.log(id)// 20  age不是变量,为了让id获得age的属性
console.log(age) //  Uncaught ReferenceError: age is not defined
//给对象新添加一个带默认值的属性
var {name, single = true} = person;
console.log(single)//true
//给对象已有的变量再次赋值
// 声明变量:
var x, y;
// 解构赋值:
({x, y} = { name: '小明', x: 100, y: 200})

apply()改变this指向,两个参数,
第一个是需要绑定的this变量,
第二个是array,表示函数本身的参数

function getAge() {
    var y = new Date().getFullYear();
    return y - this.birth;
}

var xiaoming = {
    name: '小明',
    birth: 1990,
    age: getAge
};

xiaoming.age(); // 25
getAge.apply(xiaoming, []); // 25, this指向xiaoming, 参数为空

call() 与apply()区别,传参数一个一个传

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

推荐阅读更多精彩内容