单信js——基础部分

  • 数据类型
    字符串
    数字
    布尔值
    undefined
    null
    数组
    函数
    对象
    变量根据值类型分类,包含两种:基本类型值和引用类型值。
    基本类型值就是简单的数据。而引用类型值指的更多是由多个值构造的复杂对象。

常见的基本类型有:Undefined(默认)、Null(回收资源)、Boolean、Number和String。
基本类型保存在栈内存中,在内存中占有固定大小的空间,是直接对值的操作。
基本类型的值复制拷贝后修改任意一个,对另一个不会造成影响。

引用类型的值则是保存在内存中的对象,保存在堆内存中。
变量中保存的实际上只是一个指针,这个指针指向内存中的另一个位置,由于引用类型大小不固定(比如数组是可以动态增加的),不能保存在栈内存当中,但是它们的内存地址是固定的存储在栈内存当中。当查询引用类型的变量时,就首先从栈中读取内存地址,然后“顺藤摸瓜”地找到保存在堆中的值。这种方式一般称为按“引用”访问,因为我们操作的不是实际值,而是被那个值所引用的对象。
当一个变量向另一个变量复制引用类型值时,把值分配到新空间,但是值的副本只是一个指向存储在堆中的一个对象,最终修改的是同一个对象。

typeof用来确定一个变量是字符串、数字、布尔,还是undefined。
语法为: var result = typeof abc;
instanceof用来确定一个引用类型是一个什么类型的对象。
语法为: var result = aaa instanceof Array/String/Function;

var a='hello';
console.log(typeof a); //string

var arr=[];
var fn=function(){};
console.log(arr instanceof Array); //true
console.log(fn instanceof Function); //true

  • 数组
    arr=新的数组;
    arr[下标]=新的值;
    arr.push();
    arr.unshift();
    arr.pop();
    arr.shift();

数组元素的删除
arr.splice(索引,删除的元素个数);
arr=null;

遍历数组【掌握】
for(var i=0; i<=arr.length; i++){ }
arr.forEach((value,index)=>{ });

  • 对象
    //定义对象
    var obj=new Object();
    var obj={};

//添加属性和方法
obj.属性名或方法名=值;
obj.name='张三疯';
obj.showName=function(){
console.log(this.name);
}

//使用属性和方法【掌握】
obj.name; //第一种,用.符号调用属性(最常用)
obj['name']; //第二种,动态属性

  • 函数
    //定义函数
    function 函数名(形式参数1,形式参数2,形式参数n){
    //函数体
    return 值;
    return [值,值]; //将返回值转换成数组即可返回多个值
    }

//定义匿名函数
var fn=function(){
};

//实例化一个函数对象
var fn=new Function();

//调用函数: 将函数的返回值放在函数的调用处
fn();

如果函数没有返回值,默认返回undefined
function foo() {
return
{ name: 'foo' };
}
foo(); // undefined
注意return语句的一个大坑,如果把return语句拆成两行,相当于return undefined,下面一句已经不执行了。

允许实参个数和形参个数不一致。
函数中的内置对象arguments,它只在函数内部起作用,并且永远指向当前函数的调用者传入的所有参数。
利用arguments,你可以获得调用者传入的所有参数。实际上arguments最常用于判断传入参数的个数。

  • 结构语句if else
    其中else语句是可选的。如果语句块只包含一条语句,那么可以省略{}
    省略{}的危险之处在于,如果后来想添加一些语句,却忘了写{},就改变了if...else...的语义,else后的第二句已经不在else的控制范围了

  • DOM文档对象模型
    //查(查询、获取)
    document.getElementById(ID);
    document.getElementsByName(NAME);
    document.getElementsByTagName(标签名);
    document.getElementsByClassName(类名);
    document.getAttribute('属性名'); //获取指定的属性值
    document.querySelector('h1'); //HTML5提供的新的DOM API

//新增
var h1=document.createElement('h1'); //在内存中创建一个DOM元素
div.appendChild(h1); //将内存中创建好的DOM元素添加到DIV上

//修改
div.className='新的值'; //修改属性值
div.innerHTML=HTML的值; //修改内容
div.innerText='';

//删除
div.removeChild();

//事件绑定【掌握】,事件三要素:事件源、事件类型、事件处理函数
<input type="button" onclick="fn()"/>

btn.onclick=function(){
}

btn.addEventListener('click',function(){
});

  • BOM浏览器对象模型
    BOM就是 window对象:
    window.alert();
    window.setTimeout(); //超时执行,只执行一次
    window.setInterval(); //按周期执行函数,无限次执行
    window.clearInterval(); //清除周期执行函数
    window.document //DOM对象
    window.history //历史对象
    window.location //地址栏对象
    window.onload=function(){};

  • JSON是一个轻量级的数据交换格式,天然就是JS的对象。
    JSON: {"name":"张三疯","age":18}
    数据包含在大括号内
    每一组数据分为键值对,用 : 隔开
    键名必须是一个字符串,用 " " 引起来
    值可以是任意类型,如:数字、字符串、布尔值、数组、对象
    多组数据之间使用 , 隔开
    规范数据格式,让数据在接收到以后使用便捷

1. 为什么要解析JSON?
因为JSON是一种数据交换格式,在正常使用时由后端将数据传到前端,前端接收到的数据会是一个字符串。
JSON的属性名称(和字符串类型的值)要求以“双引号”包裹
JS对象字面量:  {name:”小强”}
JSON:  {“name”:”小强”}

2. JSON的转换(解析)
1) 将JSON格式字符串转换成对象【掌握】
因为JSON 只是一种文本字符串
var 对象变量=JSON.parse(字符串)
用途:通常用于将接收到的数据(字符串形式)转换成对象进行使用

2) 将对象(任意对象或数组)转换成字符串【掌握】
var 字符串=JSON.stringify(对象或数组);
用途:通常用于将数据转换成字符串以后发送到服务器存储到数据库
var obj={"name":"张三疯","age":18};
//将对象转换成字符串
var str=JSON.stringify(obj);
console.log(typeof str,str);  //string {"name":"张三疯","age":18}

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