【JavaScript基础系列】决定你的人生能走多远的,是基础。
前言
javaScript门槛非常低,一点语法,一个dom,一个bom就可以使用它开发大部分js应用,再加上现在层出不穷的框架极大的简化抽象了javaScript的使用方式,但是我们始终不能忘记的一点是,决定上层建筑的,是经济基础。 决定你的javaScript能走多远的,是基础。所以我决定在我的博客开一个关于javaScript基础系列。详细得,解读其中的基础,再次刨开它的心脏细细研究。与大家共勉。
第一篇 字符串一
我们从字符串开始介绍。
字符串(String) 基础概念:一串有意义的字符集合叫做字符串,在js中使用单引号‘string’ 或者双引号 "string"表示字符串。它是js五个基本类型之一,姑且可以认为它是js基本类型中特性最多的,技巧最多的基本类型。其他的如Number、boolean、null、undefined,其使用方式,引用方法,概念都没有字符串来得多。
了解js中的字符串的使用原理
一、字符串的表达形式。
① 通过字面表达式定义的字符串。
var str = "这是一串字符串";
声明了一个变量str ,给这个变量指定值字符串 “”;
②通过js内置的String构造函数,
/*****************************
通过构造函数定义的字符串,
实际上可以叫做字符串对象,
在chorme中返回一个字符拆分的对象
*/
var str = new String("hello world");
console.log(str);
二、字符串与字符串对象(为什么普通字符串可以调用构造函数的方法?)。
通过字面表达式定义的字符串与通过js内置的String构造函数生成的字符串,它们在使用的时候,行为似乎是一致的,但是,在更正确的表达中,它们是不同的,通过字面表达式我们直接给变量赋予了一个字符串值,而通过构造函数,我们得到的是一个String对象。
下图是内置的String构造函数在chorme中返回一个字符拆分的对象:

而字面量方式则是:

通过对两个方式的typeof对比,我们可以看到:
/*****************************
通过构造函数定义的字符串,
实际上可以叫做字符串对象,
在chorme中返回一个字符拆分的对象
*/
var str = new String("hello world");
console.log(str); //上图1 /*****************************
通过typeof检查的字符串对象,返回了object
*/
var _type = typeof str;
console.log(_type) //object /*****************************
不使用构造函数,直接赋值呢?
它就是一个基本值,
typeOf返回string
*/
var str1 = "hello world";
console.log(str1); //上图2 var _type1 = typeof str1;
console.log(_type1) //string
它们是否相等?答案是不相等,
console.log(str === str1); //false
那么我可以这么简单的理解:new操作符只会返回对象,new String()永远都是一个对象,而对象是不会和字符串相等的。
有一点经验的同学应该可以看出,这里如果使用==的话,str==str1,返回的是true。这是因为js中的类型转换机制决定的,它隐式的调用了字符串对象的valueOf方法。我们可以做一个小实验:
/***************************
如果我重写str的valueOf方法将它指向一个新的值
*/
console.log("before ",str == str1);//true
str.__proto__.valueOf = function(){
return "javaScript!";
}
console.log("after ",str == str1);//false
console.log(str+str1) //javaScript!hello world
我更改了str的原形对象中的valueOf方法,使它总是返回一个新字符值 "javaScript!",最后再和str1用==比对的时候,返回了false。
目前为止可以得出结论是,字符串和字符串对象不相等,甚至不是同一个概念,一个是基本类型值,一个是构造函数生成的字符对象,但在js机制中,比较时隐式的使用了valueOf方法,调用拼接时也隐式调用了valueOf方法。
js以这种方式给字符串“继承”了一些方法,能看到的做法是,js在使用字面表达式定义的字符串调用方法时,悄悄的给它包了一层字符串对象的壳。
通过调用__proto__属性就可以看出
//通过调用__proto__属性就可以看出
console.log(str1.__proto__ === str.__proto__); //true 他们继承的对象是相等的
字符串与字符串对象的使用方式一致,typeof得到的值不同,在使用字面表达式定义的字符串调用方法时,js会隐式调用new String(),这就是为什么基础类型能够调用对象方法的原因。
通过这个理解方式,我们就不难理解为什么一个数字、一个字符串能调用内置方法了。
三、字符串下标
字符串是有下标的。由于上面介绍的字符串与字符串对象的关系,任意字符串都可以通过下标访问到对应的位置的单个字符。下图在chorme中打印的一个字符串对象:

可以看到一共11个字符从0到10,需要注意的是它并不是数组。而是一个属性名为0-10的对象。
/*****************************
可以通过下标访问字符串字符
这里字符串对象和字符串同样能使用下标访问,
这是因为javascript编译时,会在适当的时候将字符串包装成字符串对象,
这样一般的字符串就也可以调用String构造函数的方法了
*/
console.log(str[0]); //h
console.log(str1[0]); //h
我们可以, 通过for循环打印每一个字符,也可以,通过数组的方法借用将字符串转换成数组:
Array.prototype.slice.call(str)
//["h", "e", "l", "l", "o", " ", "w", "o", "r", "l", "d"]
但是需要注意的是,如果你直接修改str[11] = "!"的话,只会在对象中新增了一个名为11的属性,并不会修改到字符串本身的值。
str[11] = "!";
console.log(str.valueOf()) // hello world 修改失败!
为什么js要这么干?将字符串存储两份,一份是一个一个的对象属性字符集,另一份指向原始值,也就是上图的 [[PrimitiveValue]].。
我觉得它们有一个先后关系,先生成一个一个的对象属性,再由对象属性的一个个字符拼接成 [[PrimitiveValue]];
单元总结
真正的基础是什么?我觉得是它的内在原理,它的实现思路以及实现方式,所以文中并没有给出更多的字符串操作方法,
本章介绍了字符串调用方法的来历,介绍了字符串下标的原理。下一章讲什么,待定,博主是一边回顾基础,一边理解,一边写博客,当然也有很多不正确的地方,感谢大家包容,更感谢大家指正。
最后
==============================================================================================
一首诗
我想写一首诗,
歌颂风,
颂唱雨。
只是,
我的桌子上没有一支笔,
诗没有笔可能代表着,
也许远方不那么远,
它就在笔上飞扬。
================================================================================================
转载请注明出处。 9月12日划水的下午
【JavaScript基础系列】决定你的人生能走多远的,是基础。的更多相关文章
- C#基础系列——一场风花雪月的邂逅:接口和抽象类
前言:最近一个认识的朋友准备转行做编程,看他自己边看视频边学习,挺有干劲的.那天他问我接口和抽象类这两个东西,他说,既然它们如此相像, 我用抽象类就能解决的问题,又整个接口出来干嘛,这不是误导初学者吗 ...
- c#基础系列(转)
转:http://www.cnblogs.com/landeanfen/p/4953025.html C#基础系列——一场风花雪月的邂逅:接口和抽象类 前言:最近一个认识的朋友准备转行做编程,看他自己 ...
- JVM基础系列第15讲:JDK性能监控命令
查看虚拟机进程:jps 命令 jps 命令可以列出所有的 Java 进程.如果 jps 不加任何参数,可以列出 Java 程序的进程 ID 以及 Main 函数短名称,如下所示. $ jps 6540 ...
- JVM基础系列第14讲:JVM参数之GC日志配置
说到 Java 虚拟机,不得不提的就是 Java 虚拟机的 GC(Garbage Collection)日志.而对于 GC 日志,我们不仅要学会看懂,而且要学会如何设置对应的 GC 日志参数.今天就让 ...
- JVM基础系列第13讲:JVM参数之追踪类信息
我们都知道 JVM 在启动的时候会去加载类信息,那么我们怎么得知他加载了哪些类,又卸载了哪些类呢?我们这一节就来介绍四个 JVM 参数,使用它们我们就可以清晰地知道 JVM 的类加载信息. 为了方便演 ...
- JVM基础系列第11讲:JVM参数之堆栈空间配置
JVM 中最重要的一部分就是堆空间了,基本上大多数的线上 JVM 问题都是因为堆空间造成的 OutOfMemoryError.因此掌握 JVM 关于堆空间的参数配置对于排查线上问题非常重要. tips ...
- JVM基础系列第10讲:垃圾回收的几种类型
我们经常会听到许多垃圾回收的术语,例如:Minor GC.Major GC.Young GC.Old GC.Full GC.Stop-The-World 等.但这些 GC 术语到底指的是什么,它们之间 ...
- JVM基础系列第9讲:JVM垃圾回收器
前面文章中,我们介绍了 Java 虚拟机的内存结构,Java 虚拟机的垃圾回收机制,那么这篇文章我们说说具体执行垃圾回收的垃圾回收器. 总的来说,Java 虚拟机的垃圾回收器可以分为四大类别:串行回收 ...
- JVM基础系列第8讲:JVM 垃圾回收机制
在第 6 讲中我们说到 Java 虚拟机的内存结构,提到了这部分的规范其实是由<Java 虚拟机规范>指定的,每个 Java 虚拟机可能都有不同的实现.其实涉及到 Java 虚拟机的内存, ...
随机推荐
- Stacked Regression的详细步骤和使用注意事项
声明:这篇博文是我基于一篇网络文章翻译的,并结合了自己应用中的一些心得,如果有侵权,请联系本人删除. 最近做推荐的时候,开始接触到Stacking方法,在周志华老师的西瓜书中,Stacking方法是在 ...
- windows安装设备的驱动程序软件遇…
问题描述: 有时候我们在使用一些设备的时候需要获取电脑的驱动.安装方式一共有三种: 第一种是让系统自动更新和安装. 第二种是打开"资源管理器"选择指定文件夹路径更新. 第三种是使用 ...
- 使用递归算法结合数据库解析成java树形结构
使用递归算法结合数据库解析成java树形结构 1.准备表结构及对应的表数据a.表结构: create table TB_TREE ( CID NUMBER not null, CNAME VARCHA ...
- 贪心:字典树openjudge1799-最短前缀
描述 一个字符串的前缀是从该字符串的第一个字符起始的一个子串.例如 "carbon"的字串是: "c", "ca", "car&q ...
- jsp隐藏关键 敏感信息,只显示前后字段
今天写jsp页面,要求对字段中间部分隐藏,只显示前几位和后几位.搜了一下发现网上大都是隐藏前面指定字段,或者是利用正则表达式隐藏手机号或是身份证.这样的话必须预先知道字段长度,而我不想知道长度只显示前 ...
- Linux误删C基本运行库libc.so.6处理方法
1. libc.so.6介绍/usr/lib/libc.so.6是glibc的软链接,不同的平台可能路径会不一样.使用命令查看会看到: [root@farmer:~]$ls -l /lib/libc. ...
- python学习之数字
数字python中的数字比较典型,典型在可以表示很小的数,也可以表示很大的数,c语言的数字类型如果表示很大的数的话,可能会报溢出错误,但是python不会,python 数字类型的完整工具包括整数和浮 ...
- python 基础-----数字,字符串,列表,字典类型简单介绍
一.第一个python小程序 1.下载安装python2.7和python3.6的版本及pycharm,我们可以再解释器中输入这样一行代码: 则相应的就打出了一句话.这里的print是打印的意思.你输 ...
- vue.js语法
Vue.js是当下很火的一个JavaScript MVVM(Model-View-ViewModel)库,它是以数据驱动和组件化的思想构建的.相比于Angular.js,Vue.js提供了更加简洁.更 ...
- Android 主题theme说明 摘记
主题Theme就是用来设置界面UI风格,可以设置整个应用或者某个活动Activity的界面风格.在Android SDK中内置了下面的Theme,可以按标题栏Title Bar和状态栏Status B ...